@charset "UTF-8";
/* RESET All ELEMENT */
@import url(//fonts.googleapis.com/earlyaccess/notosanstc.css);
html, body, div, span, table, caption, tbody, tfoot, thead, tr, th, td, font, img, small, strong, sub, sup, p, a, dl, dt, dd, ol, ul, li, form, label { vertical-align: baseline; font-family: inherit; font-weight: inherit; font-style: inherit; font-size: 100%; outline: 0; padding: 0; margin: 0; border: 0; }

/* SPECIAL RESET */
ol, ul { list-style: none; }

/*th,td{font-weight:normal;text-align:left;}*/
table { border-collapse: separate; border-spacing: 0; }

:focus { outline: none; }

/*============================================
=                    Base                    =
============================================*/
html * { max-height: 1000000px; -webkit-text-size-adjust: 100%; /*-webkit-overflow-scrolling:touch;*/ }

a { color: #535353; text-decoration: none; }

a, area { outline: none; hlbr: expression(this.onFocus=this.blur()); }

img { vertical-align: top; }

input::-ms-clear { display: none; }

.font-NotoSans { font-family: 'Noto Sans TC', '微軟正黑體', sans-serif; }

.font-Oswald { font-family: 'Oswald', sans-serif; }

body.load::-webkit-scrollbar { display: none; }

body.load { -ms-overflow-style: none; scrollbar-width: none; }

body.load .svgload { opacity: 1; }

/*=============================================
=                    base                     =
=============================================*/
body { font-family: "Oswald", sans-serif, "Noto Sans TC", "Microsoft JhengHei"; color: #656565; background: #fff; }

input, select, textarea { font-family: 'Oswald',sans-serif,'Noto Sans TC','Microsoft JhengHei'; padding: 0; margin: 0; vertical-align: middle; }

a { color: inherit; text-decoration: underline; }

@media screen and (max-width: 1260px) { body { font-size: 16px; } }
h5, h4, h3, h2, h1, p, div, a, span { padding: 0; margin: 0; font-family: 'Oswald',sans-serif,'Noto Sans TC','Microsoft JhengHei'; }

/*=============================================
=                  headerBox                  =
==============================================*/
.headerBox { width: 100%; display: inline-block; position: fixed; background: #fff; left: 0; top: 0px; height: 70px; z-index: 100; pointer-events: none; box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.3); }
.headerBox.on { top: 0; }

.headerWrap { display: block; position: absolute; top: 0; left: 50%; width: 1200px; height: 100%; margin: 0 0 0 -600px; }
.headerWrap .header { position: relative; height: 100%; width: 100%; transition: background 0.3s; }
.headerWrap .header .logo { display: block; position: absolute; top: 15px; left: 5%; width: 158px; height: 42px; background: url(../img/ftft-logo.svg) 0 0 no-repeat; background-size: 158px auto; z-index: 1; pointer-events: all; }
.headerWrap .navSwitch { display: none; pointer-events: all; }
.headerWrap .nav { display: block; position: absolute; top: 0; right: 3%; width: 70%; height: 70px; }
.headerWrap .nav ul { width: 100%; overflow: hidden; text-align: right; font-size: 0; }
.headerWrap .nav li { position: relative; height: 70px; text-align: center; display: inline-block; font-size: 0; }
.headerWrap .nav li:last-child:after { display: none; }
.headerWrap .nav li.on a { color: #0F4231; }
.headerWrap .nav li.on a:after { left: 0; width: 100%; }
.headerWrap .nav li a { position: relative; pointer-events: all; display: inline-block; font-weight: bold; line-height: 70px; color: #000000; text-decoration: none; padding: 0 28px; font-family: 'Noto Sans TC'; font-style: normal; font-weight: normal; font-size: 18px; text-align: center; letter-spacing: 0.07em; }
.headerWrap .nav li a:after { display: block; position: absolute; bottom: 20%; left: 50%; width: 0; height: 4px; content: ''; background-color: #E2BC63; transition: 0.3s; }

@media (hover: hover) { .nav .navList a:hover { color: #0F4231; font-style: normal; font-weight: bold; }
  .nav .navList a:hover:after { width: 100%; left: 0; } }
@media screen and (max-width: 1260px) { .headerWrap { width: 100%; left: 0; margin-left: 0; }
  .headerWrap.on .nav { top: 0; }
  .headerWrap.on .navBg { opacity: 0.7; z-index: 99; }
  .headerWrap .header .logo { left: 6%; }
  .headerWrap .navSwitch { position: fixed; top: 0; right: 0; width: 24px; height: 0; display: block; padding: 35px 30px; z-index: 101; }
  .headerWrap .navSwitch.x .lines { width: 100%; top: 0; background: transparent; }
  .headerWrap .navSwitch.x .lines:before, .headerWrap .navSwitch.x .lines:after { width: 100%; background: #0F4231; top: 0; right: 0; left: inherit; }
  .headerWrap .navSwitch.x .lines:before { transform: rotate3d(0, 0, 1, 48deg); }
  .headerWrap .navSwitch.x .lines:after { transform: rotate3d(0, 0, 1, -48deg); }
  .headerWrap .navSwitch .lines { display: inline-block; height: 2px; background: #fff; transition: 0.3s; position: relative; vertical-align: top; width: 100%; left: 0; transition: .2s; }
  .headerWrap .navSwitch .lines:before { top: 7px; }
  .headerWrap .navSwitch .lines:after { top: -7px; }
  .headerWrap .navSwitch .lines:before, .headerWrap .navSwitch .lines:after { display: inline-block; height: 100%; width: 100%; background: #fff; transition: 0.3s; position: absolute; left: 0; content: ''; }
  .headerWrap .nav { position: fixed; top: -100%; right: 0%; width: 100%; height: 100vh; z-index: 100; transition: all 0.5s; }
  .headerWrap .nav .navList { padding-top: 70px; }
  .headerWrap .nav li { float: none; width: 100%; height: auto; padding: 0px 0; transition: 1.1s; border-bottom: 1px solid #0F4231; }
  .headerWrap .nav li:first-child { border-top: 1px solid #0F4231; }
  .headerWrap .nav li:after { display: none; }
  .headerWrap .nav li a { width: 100%; padding: 0px 0; display: block; margin: 0 0 0 0; background: #fff; color: #000; transition: 1.1s; font-size: 18px; font-weight: 700; }
  .headerWrap .nav li a:after { opacity: 0; }
  .headerWrap .nav li.on a { color: #fff; background: #0F4231; }
  .navBg { position: fixed; top: 0; left: 0; width: 100%; height: 100vh; background: #000; opacity: 0; z-index: -1; transition: opacity 0.5s; }
  .setTop .header { position: fixed; top: 0; left: 0; width: 100%; height: 70px; box-shadow: none; background: #fff; z-index: 101; }
  .setTop .header .logo { background-image: url(../img/m/logo.png); }
  .setTop .navSwitch .lines { background: #0F4231; }
  .setTop .navSwitch .lines:before, .setTop .navSwitch .lines:after { background: #0F4231; } }
@media screen and (max-width: 1260px) and (hover: hover) { .nav .navList a:hover { color: #18668d; }
  .headerWrap .nav li a:hover { color: #fff; background: #0F4231; } }
@media screen and (max-width: 767px) { .headerWrap .header .logo { left: 17px; }
  .headerWrap .navSwitch { padding: 30px 17px; } }
/*=============================================
=                  partWrap                  =
==============================================*/
.partWrap { max-width: 1200px; width: 96%; margin: 0 auto; position: relative; z-index: 1; padding: 0 2%; box-sizing: border-box; }
@media screen and (max-width: 1260px) { .partWrap { width: 96%; padding: 0 3%; } }
@media screen and (max-width: 980px) { .partWrap { padding: 0 4%; width: 100%; } }
@media screen and (max-width: 767px) { .partWrap { padding: 0 5%; width: 100%; } }

/*=============================================
=                  partWrap                  =
==============================================*/
.partWrap_sub { max-width: 1000px; width: 96%; margin: 0 auto; position: relative; z-index: 1; padding: 0 2%; box-sizing: border-box; }
@media screen and (max-width: 1260px) { .partWrap_sub { width: 100%; padding: 0 4%; } }
@media screen and (max-width: 980px) { .partWrap_sub { width: 100%; padding: 0 6%; } }
@media screen and (max-width: 767px) { .partWrap_sub { padding: 0 8%; width: 100%; } }

.main { padding-top: 70px; overflow: hidden; }

/*=============================================
=                    part0                    =
=============================================*/
.svgload { position: fixed; left: 0; top: 0; width: 100vw; height: 100vh; z-index: 100000; pointer-events: none; opacity: 0; transition: 0.8s; font-size: 0; text-align: center; }
.svgload:before { content: ''; display: inline-block; width: 0; height: 100%; vertical-align: middle; }
.svgload .load_bg { width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 0; opacity: 1; background: url(../img/KVopen.png); }
.svgload #svgloading { margin: 0 auto; display: inline-block; width: 198px; height: 198px; vertical-align: middle; }

.part0 { padding: 0px 0; text-align: center; position: relative; width: 100%; overflow: hidden; height: calc(100vh - 70px); background: url(../img/KVopen.png) center center no-repeat; }
.part0 .rightTopImg { position: absolute; right: 5%; top: 5%; z-index: 15; width: 111px; }
.part0 .leftTopImg { position: absolute; left: 0; top: 0; z-index: 15; max-width: 81px; width: 81px; }
.part0 .rightBottomImg { position: absolute; right: 0; bottom: 0; z-index: 15; max-width: 221px; width: 221px; }
.part0 .videoBox { display: block; position: absolute; left: 0; top: 0; z-index: 10; width: 100%; height: 100%; opacity: 0; }
.part0 .videoBox video { display: block; width: 100%; vertical-align: top; }
.part0 .videoBox.on { opacity: 1; }
.part0 .videoBox #vv_pc { display: block; }
.part0 .videoBox #vv_pad { display: none; }
.part0 .videoBox #vv_m { display: none; }
.part0 .videoBox_loop { display: none; position: absolute; left: 0%; top: 0%; z-index: 9; font-size: 0; }
.part0 .videoBox_loop video { display: inline-block; }
.part0 .videoBox_loop.on { display: inline-block; z-index: 11; }
.part0 .videoBox_loop #vv_pc_loop { display: block; }
.part0 .videoBox_loop #vv_pad_loop { display: none; }
.part0 .videoBox_loop #vv_m_loop { display: none; }
.part0 .partWrap { height: 100%; display: block; z-index: 12; }
.part0 .articleBox { text-align: center; display: block; width: 100%; position: relative; }
.part0 .articleBox .kvContentBox { display: inline-block; vertical-align: top; width: 100%; }
.part0 .articleBox .kvContentBox #svgContainer_pc, .part0 .articleBox .kvContentBox #svgContainer_pad, .part0 .articleBox .kvContentBox #svgContainer_m { width: 100%; display: inline-block; position: absolute; left: 0; top: 0; opacity: 0; }
.part0 .articleBox .kvContentBox #svgContainer_pc.on, .part0 .articleBox .kvContentBox #svgContainer_pad.on, .part0 .articleBox .kvContentBox #svgContainer_m.on { opacity: 1; }
.part0 .articleBox .kvContentBox #svgContainer_pc_loop, .part0 .articleBox .kvContentBox #svgContainer_pad_loop, .part0 .articleBox .kvContentBox #svgContainer_m_loop { width: 100%; display: inline-block; position: absolute; left: 0; top: 0; opacity: 0; }
.part0 .articleBox .kvContentBox #svgContainer_pc_loop.on, .part0 .articleBox .kvContentBox #svgContainer_pad_loop.on, .part0 .articleBox .kvContentBox #svgContainer_m_loop.on { opacity: 1; }
.part0 .articleBox.articleBox_pc { display: block; width: 100%; }
.part0 .articleBox.articleBox_pad { display: none; width: 85%; }
.part0 .articleBox.articleBox_m { display: none; width: 100%; }
@media screen and (max-width: 980px) { .part0 .partWrap { position: absolute; left: 0; top: 0; }
  .part0 .videoBox { display: block; position: relative; left: 0; top: 0; }
  .part0 .videoBox #vv_pc { display: none; }
  .part0 .videoBox #vv_pad { display: block; }
  .part0 .videoBox #vv_m { display: none; }
  .part0 .videoBox_loop { display: inline-block; }
  .part0 .videoBox_loop #vv_pc_loop { display: none; }
  .part0 .videoBox_loop #vv_pad_loop { display: block; }
  .part0 .videoBox_loop #vv_m_loop { display: none; }
  .part0 .articleBox.articleBox_pc { display: none; }
  .part0 .articleBox.articleBox_pad { display: block; }
  .part0 .articleBox.articleBox_m { display: none; }
  .part0 .leftTopImg { width: 22%; }
  .part0 .rightBottomImg { width: 66%; } }
@media screen and (max-width: 767px) { .part0 { height: initial; }
  .part0 .mResize { position: relative; height: 0; width: 100%; padding-top: calc(164% - 57px); }
  .part0 .rightTopImg { display: inline-block; }
  .part0 .leftTopImg { width: 22%; }
  .part0 .rightBottomImg { width: 66%; }
  .part0 .videoBox #vv_pc { display: none; }
  .part0 .videoBox #vv_pad { display: none; }
  .part0 .videoBox #vv_m { display: block; }
  .part0 .videoBox_loop { display: inline-block; }
  .part0 .videoBox_loop #vv_pc_loop { display: none; }
  .part0 .videoBox_loop #vv_pad_loop { display: none; }
  .part0 .videoBox_loop #vv_m_loop { display: block; }
  .part0 .partWrap { max-width: 100%; width: 94%; padding: 0 0; }
  .part0 .articleBox.articleBox_pc { display: none; }
  .part0 .articleBox.articleBox_pad { display: none; }
  .part0 .articleBox.articleBox_m { display: block; }
  .part0 .bgBox > img.pcImg { display: none; }
  .part0 .bgBox > img.padImg { display: none; }
  .part0 .bgBox > img.mImg { display: block; } }

/*=============================================
=                    part1                    =
=============================================*/
.fixedBox { position: absolute; right: 0; top: 100vh; height: 100vh; pointer-events: none; width: 100px; vertical-align: middle; font-size: 0; z-index: 100; overflow: hidden; }
.fixedBox:before { content: ''; display: inline-block; vertical-align: middle; height: 100%; width: 0; }
.fixedBox .aBox { width: 100%; display: inline-block; vertical-align: middle; }
.fixedBox a { pointer-events: all; display: inline-block; width: 100%; margin: 4px 0; padding: 20px 20px; transition: 0.4s; transform: translateX(40px); border-radius: 8px 0 0 8px; box-shadow: 0 0 5px #000; }
.fixedBox a span { font-size: 18px; width: 100%; display: inline-block; color: #fff; font-weight: 400; text-shadow: 2px 2px 5px #444; -ms-writing-mode: tb-lr; writing-mode: vertical-lr; -webkit-writing-mode: vertical-lr; letter-spacing: 0.1em; }
@media (hover: hover) { .fixedBox a:hover { transform: translateX(30px); } }
.fixedBox a.fixed0 { background: #e2bc63; }
.fixedBox a.fixed1 { background: #0f4231; }
.fixedBox.fixed { position: fixed; top: 0; }
@media screen and (max-width: 767px) { .fixedBox { position: relative; right: 0; top: initial; height: auto; width: 100%; overflow: visible; margin-top: -13%; position: fixed; top: initial; bottom: 0; }
  .fixedBox a { width: 100%; padding: 10px 0; margin: 0px 0; border-radius: 8px 8px 0 0px; transform: translateX(0px); }
  .fixedBox a span { font-size: 16px; width: 100%; text-align: center; -ms-writing-mode: lr-tb; writing-mode: horizontal-tb; -webkit-writing-mode: horizontal-tb; letter-spacing: 0.1em; } }
@media screen and (max-width: 767px) and (hover: hover) { .fixedBox a:hover { transform: translateX(0px); } }
@media screen and (max-width: 767px) { .fixedBox.fixed { position: fixed; top: initial; bottom: 0; } }

.part1 { padding: 140px 0; text-align: center; position: relative; width: 100%; overflow: hidden; z-index: 1; }
.part1 .ttBox0 { text-align: left; position: relative; padding: 60px 0 60px 0; margin: 0 1% 70px 1%; }
.part1 .ttBox0 h2 { font-size: 30px; color: #0F4231; line-height: 1em; font-weight: 500; opacity: 0; transition: 1.1s; transform: translateY(10px); }
.part1 .ttBox0 h1 { font-size: 42px; color: #0F4231; line-height: 1em; font-weight: 900; opacity: 0; transition: 1.1s; transform: translateY(10px); letter-spacing: 0.05em; }
.part1 .ttBox0 h1 b { color: #E2BC63; font-size: 120px; padding: 0 0.05em; }
.part1 .ttBox0 .oo0 { width: 30%; overflow: hidden; max-width: 327px; position: absolute; left: 0; top: 0; transition: 1.1s; height: 0; max-height: 136px; }
.part1 .ttBox0 .oo0 span { display: inline-block; vertical-align: top; }
.part1 .ttBox0 .oo1 { width: 40%; overflow: hidden; position: absolute; right: 0; bottom: 8%; transition: 1.1s; height: 2px; text-align: left; font-size: 0; }
.part1 .ttBox0 .oo1 span:nth-child(2) { display: inline-block; background: #E2BC63; width: 0%; height: 2px; vertical-align: top; margin-left: 5%; transition: 1.1s; }
.part1 .ttBox0 .oo1 span:nth-child(1) { display: inline-block; background: #E2BC63; width: 0%; height: 2px; vertical-align: top; transition: 1.1s; }
.part1 .ttBox0 .oo2 { width: 70%; overflow: hidden; position: absolute; right: 0; bottom: 0; transition: 1.1s; height: 2px; text-align: left; }
.part1 .ttBox0 .oo2 span { display: inline-block; background: #E2BC63; width: 0%; height: 2px; vertical-align: top; transition: 1.1s; }
.part1 .eachBox { display: block; }
.part1 .eachBox .each { width: 31%; box-sizing: border-box; vertical-align: top; padding: 100px 2% 0 0; position: relative; display: inline-block; }
.part1 .eachBox .each .rBox { width: 100%; display: block; }
.part1 .eachBox .each .aside { font-size: 18px; line-height: 1em; text-shadow: 2px 2px 5px #444; display: inline-block; border-radius: 5px; color: #fff; position: absolute; left: 0; top: 0; width: 180px; height: 82px; background: url(../img/pic1_1.png) no-repeat center top; background-size: contain; font-weight: 500; transition: 1.1s; opacity: 0; transform: translateY(20px); }
.part1 .eachBox .each .aside span { display: inline-block; padding-top: 9%; }
.part1 .eachBox .each .svgImg { display: block; text-align: center; }
.part1 .eachBox .each .svgImg > div { display: inline-block; width: 80%; max-width: 170px; }
.part1 .eachBox .each h3 { font-size: 34px; line-height: 1.5em; color: #0F4231; display: block; text-align: center; font-weight: 900; -moz-transition: 1.1s 0.5s; -o-transition: 1.1s 0.5s; -webkit-transition: 1.1s; -webkit-transition-delay: 0.5s; transition: 1.1s 0.5s; opacity: 0; transform: translateY(20px); }
.part1 .eachBox .each h4 { font-size: 18px; line-height: 1.5em; color: #000; display: block; text-align: center; font-weight: 400; -moz-transition: 1.1s 0.5s; -o-transition: 1.1s 0.5s; -webkit-transition: 1.1s; -webkit-transition-delay: 0.5s; transition: 1.1s 0.5s; opacity: 0; transform: translateY(20px); }
.part1.go .ttBox0 h2 { opacity: 1; transform: translateY(0px); }
.part1.go .ttBox0 h1 { opacity: 1; transform: translateY(0px); }
.part1.go .ttBox0 .oo0 { height: 136px; }
.part1.go .ttBox0 .oo1 span:nth-child(2) { width: 10%; }
.part1.go .ttBox0 .oo1 span:nth-child(1) { width: 85%; }
.part1.go .ttBox0 .oo2 span { width: 80%; }
.part1.go .eachBox .each .aside { opacity: 1; transform: translateY(0px); }
.part1.go .eachBox .each h3 { opacity: 1; transform: translateY(0px); }
.part1.go .eachBox .each h4 { opacity: 1; transform: translateY(0px); }
@media screen and (max-width: 980px) { .part1 { padding: 100px 0; }
  .part1 .ttBox0 { padding: 7% 0 10% 0; }
  .part1 .ttBox0 .padBlock { display: block; }
  .part1 .eachBox .each h3 { font-size: 34px; }
  .part1 .eachBox .each p { font-size: 20px; } }
@media screen and (max-width: 767px) { .part1 { padding: 50px 0; }
  .part1 .ttBox0 { padding: 9% 0 9% 0; margin: 0 2% 20px 2%; }
  .part1 .ttBox0 .mBlock { display: block; }
  .part1 .ttBox0 h2 { font-size: 18px; line-height: 1.5em; }
  .part1 .ttBox0 h1 { display: block; font-size: 40px; line-height: 1em; font-weight: bold; letter-spacing: 0.1em; text-align: right; text-justify: inter-ideograph; }
  .part1 .ttBox0 h1 span { font-size: 32px; }
  .part1 .ttBox0 h1 b { font-size: 56px; }
  .part1 .ttBox0 .oo0 { width: 45%; }
  .part1 .ttBox0 .oo0 span img { width: 100%; }
  .part1 .ttBox0 .oo1 { width: 40%; bottom: 5%; }
  .part1 .ttBox0 .oo2 { width: 74%; }
  .part1 .eachBox .each { width: 90%; padding: 70px 0% 0 0; font-size: 0; margin: 20px auto; }
  .part1 .eachBox .each .rBox { width: 55%; display: inline-block; vertical-align: middle; margin-left: 3%; }
  .part1 .eachBox .each .aside { width: 150px; }
  .part1 .eachBox .each .svgImg { display: inline-block; width: 42%; vertical-align: middle; }
  .part1 .eachBox .each .svgImg > div { display: inline-block; width: 100%; max-width: 170px; }
  .part1 .eachBox .each h3 { font-size: 24px; line-height: 1.5em; }
  .part1 .eachBox .each h4 { font-size: 16px; line-height: 1.5em; } }

/*=============================================
=                    part6                   =
=============================================*/
.part6 { padding: 120px 0; text-align: center; position: relative; width: 100%; background: #0F4231; z-index: 10; }
.part6 #svgContainer6_0 { width: 132px; display: inline-block; position: absolute; left: -1%; top: -225px; opacity: 1; }
.part6 #svgContainer6_1 { width: 240px; display: inline-block; position: absolute; right: -10%; top: -200px; opacity: 1; }
.part6 #svgContainer6_2 { width: 132px; display: inline-block; position: absolute; right: -1%; bottom: -225px; opacity: 1; }
.part6 .partWrap { margin: 0 auto; position: relative; z-index: 1; }
.part6 .ttBox0 { text-align: left; position: relative; padding: 60px 0 60px 0; margin: 0 1% 50px 1%; }
.part6 .ttBox0 h1 { font-size: 38px; color: #fff; line-height: 1.2em; font-weight: 400; opacity: 0; transition: 1.1s; transform: translateY(10px); letter-spacing: 0.05em; position: relative; display: inline-block; vertical-align: middle; }
.part6 .ttBox0 .h1_oo1 { width: 30%; overflow: hidden; transition: 1.1s; height: 2px; text-align: left; font-size: 0; font-size: 38px; display: inline-block; vertical-align: middle; margin-left: 10px; }
.part6 .ttBox0 .h1_oo1 > span:nth-child(1) { display: inline-block; background: #fff; width: 0%; height: 2px; vertical-align: top; transition: 1.1s; }
.part6 .ttBox0 .h1_oo1 > span:nth-child(2) { display: inline-block; background: #fff; width: 0%; height: 2px; vertical-align: top; transition: 1.1s; margin-left: 5%; }
.part6 .ttBox0 .oo0 { width: 327px; overflow: hidden; max-width: 327px; position: absolute; left: 0; top: 0; transition: 1.1s; height: 0; max-height: 136px; }
.part6 .ttBox0 .oo0 span { display: inline-block; vertical-align: top; }
.part6 .ttBox0 .oo3 { width: 63px; overflow: hidden; position: absolute; left: 0%; top: 0px; transition: 1.1s; height: 0; max-height: 316px; margin-left: -31px; margin-top: 160px; max-width: 63px; }
.part6 .ttBox0 .oo3 span { display: inline-block; vertical-align: top; width: 100%; }
.part6 .ttBox0 .oo3 span img { width: 100%; }
.part6 .ttBox0 .oo1 { width: 40%; overflow: hidden; position: absolute; right: 0; bottom: 8%; transition: 1.1s; height: 2px; text-align: left; font-size: 0; }
.part6 .ttBox0 .oo1 span:nth-child(2) { display: inline-block; background: #E2BC63; width: 0%; height: 2px; vertical-align: top; margin-left: 5%; transition: 1.1s; }
.part6 .ttBox0 .oo1 span:nth-child(1) { display: inline-block; background: #E2BC63; width: 0%; height: 2px; vertical-align: top; transition: 1.1s; }
.part6 .ttBox0 .oo2 { width: 70%; overflow: hidden; position: absolute; right: 0; bottom: 0; transition: 1.1s; height: 2px; text-align: left; }
.part6 .ttBox0 .oo2 span { display: inline-block; background: #E2BC63; width: 0%; height: 2px; vertical-align: top; transition: 1.1s; }
.part6 .eachBox0 { text-align: center; position: relative; font-size: 0; -moz-transition: 1.1s 0.3s; -o-transition: 1.1s 0.3s; -webkit-transition: 1.1s; -webkit-transition-delay: 0.3s; transition: 1.1s 0.3s; opacity: 0; transform: translateY(20px); }
.part6 .eachBox0 .each { display: inline-block; width: 33%; box-sizing: border-box; vertical-align: top; padding: 44px 10px; text-align: center; }
.part6 .eachBox0 .each img { width: 36%; max-width: 69px; display: inline-block; }
.part6 .eachBox0 .each h3 { font-size: 32px; line-height: 1.5em; color: #fff; display: block; text-align: center; padding: 10px 0; }
.part6 .eachBox0 .each p { font-size: 16px; line-height: 1.5em; color: #fff; display: block; text-align: center; }
.part6 .eachBox1 { text-align: center; position: relative; font-size: 0; width: 98%; display: block; margin: 50px auto 0 auto; -moz-transition: 1.1s 0.6s; -o-transition: 1.1s 0.6s; -webkit-transition: 1.1s; -webkit-transition-delay: 0.6s; transition: 1.1s 0.6s; opacity: 0; transform: translateY(20px); }
.part6 .eachBox1.on0 .ttBox h3:nth-child(1) { text-shadow: none; z-index: 2; color: #0F4231; }
.part6 .eachBox1.on0 .ttBox h3:nth-child(1):after { background: url(../img/pic6_2_on.png) no-repeat left center; background-size: 100% 100%; }
.part6 .eachBox1.on0 .tdBox .each:nth-child(1) { display: block; }
.part6 .eachBox1.on1 .ttBox h3:nth-child(2) { text-shadow: none; z-index: 2; color: #0F4231; }
.part6 .eachBox1.on1 .ttBox h3:nth-child(2):after { background: url(../img/pic6_3_on.png) no-repeat left center; background-size: 100% 100%; }
.part6 .eachBox1.on1 .tdBox .each:nth-child(2) { display: block; }
.part6 .eachBox1 .ttBox { width: 100%; font-size: 0; }
.part6 .eachBox1 .ttBox h3 { width: 50%; display: block; text-align: center; color: #fff; padding: 22px 0; font-weight: 400; position: relative; z-index: 1; cursor: pointer; text-shadow: 0px 0px 10px #444; }
.part6 .eachBox1 .ttBox h3:nth-child(1):after { content: ''; width: 120%; position: absolute; left: 0; top: 0; height: 100%; background: url(../img/pic6_2.png) no-repeat left center; background-size: 100% 100%; z-index: -1; }
.part6 .eachBox1 .ttBox h3:nth-child(2):after { content: ''; width: 115%; position: absolute; right: 0; top: 0; height: 100%; left: inherit; background: url(../img/pic6_3.png) no-repeat right center; background-size: 100% 100%; z-index: -1; }
.part6 .eachBox1 .ttBox h3 span { display: inline-block; font-size: 32px; line-height: 1em; vertical-align: middle; }
.part6 .eachBox1 .tdBox { width: 100%; display: block; }
.part6 .eachBox1 .tdBox .each { display: none; background: #fff; border-radius: 0 0 5px 5px; padding: 100px 8%; box-sizing: border-box; width: 100%; }
.part6 .eachBox1 .tdBox .each h4 { font-size: 58px; color: #0F4231; line-height: 1.5em; text-align: left; }
.part6 .eachBox1 .tdBox .each .h4_oo1 { width: 100%; overflow: hidden; transition: 1.1s; height: 2px; text-align: left; font-size: 0; font-size: 46px; display: inline-block; vertical-align: middle; }
.part6 .eachBox1 .tdBox .each .h4_oo1 > span:nth-child(1) { display: inline-block; background: #E2BC63; width: 0%; height: 2px; vertical-align: top; transition: 1.1s; }
.part6 .eachBox1 .tdBox .each .h4_oo1 > span:nth-child(2) { display: inline-block; background: #E2BC63; width: 0%; height: 2px; vertical-align: top; transition: 1.1s; margin-left: 5%; }
.part6 .eachBox1 .tdBox .each p { display: block; vertical-align: middle; text-align: left; padding: 36px 0; }
.part6 .eachBox1 .tdBox .each p span { display: inline-block; font-size: 28px; color: #0f4231; line-height: 1.5em; text-align: left; font-weight: bold;}
.part6 .eachBox1 .tdBox .each p span:after { content: ''; background: #E2BC63; margin: 0 5px; border-radius: 10px; width: 5px; height: 5px; display: inline-block; vertical-align: middle; }
.part6 .eachBox1 .tdBox .each .btnBox { font-size: 0; padding: 20px 0 0 0; }
.part6 .eachBox1 .tdBox .each .btnBox a { margin: 0 2%; width: 44%; }
.part6 .eachBox1 .tdBox .each .btnBox a > img { display: inline-block; vertical-align: middle; width: 6%; max-width: 32px; margin-left: 5%; }
.part6 .eachBox1 .tdBox .each .btnBox a span { display: inline-block; vertical-align: middle; }
.part6 .eachBox1 .tdBox .each .btnBox .btn0 { display: inline-block; color: #fff; font-size: 26px; height: 100px; border-radius: 50px; transition: 1.1s; transform: translateY(0); background: #E2BC63; border: 1px solid #E2BC63; text-decoration: none; font-weight: bold; }
@media (hover: hover) { .part6 .eachBox1 .tdBox .each .btnBox .btn0:hover { transform: translateY(-5px); } }
.part6 .eachBox1 .tdBox .each .btnBox .btn0:before { content: ''; height: 100%; width: 0; display: inline-block; vertical-align: middle; }
.part6 .eachBox1 .tdBox .each .btnBox .btn1 { display: inline-block; color: #0F4231; font-size: 26px; height: 100px; border-radius: 50px; transition: 1.1s; transform: translateY(0); background: #fff; border: 1px solid #0F4231; text-decoration: none; font-weight: bold; }
@media (hover: hover) { .part6 .eachBox1 .tdBox .each .btnBox .btn1:hover { transform: translateY(-5px); } }
.part6 .eachBox1 .tdBox .each .btnBox .btn1 span { display: inline-block; vertical-align: middle; }
.part6 .eachBox1 .tdBox .each .btnBox .btn1:before { content: ''; height: 100%; width: 0; display: inline-block; vertical-align: middle; }
.part6.go .ttBox0 h1 { opacity: 1; transform: translateY(0px); }
.part6.go .ttBox0 .h1_oo1 span:nth-child(1) { width: 10%; }
.part6.go .ttBox0 .h1_oo1 span:nth-child(2) { width: 85%; }
.part6.go .ttBox0 .oo0 { height: 136px; }
.part6.go .ttBox0 .oo3 { height: 316px; }
.part6.go .ttBox0 .oo1 span:nth-child(2) { width: 10%; }
.part6.go .ttBox0 .oo1 span:nth-child(1) { width: 85%; }
.part6.go .ttBox0 .oo2 span { width: 80%; }
.part6.go .eachBox0 { opacity: 1; transform: translateY(0px); }
.part6.go .eachBox1 { opacity: 1; transform: translateY(0px); }
.part6.go .eachBox1 .tdBox .each .h4_oo1 span:nth-child(1) { width: 85%; }
.part6.go .eachBox1 .tdBox .each .h4_oo1 span:nth-child(2) { width: 10%; }
@media screen and (max-width: 980px) { .part6 { padding: 100px 0; }
  .part6 .ttBox0 { padding: 7% 0 10% 0; }
  .part6 .ttBox0 .padBlock { display: block; }
  .part6 .ttBox0 .oo3 { margin-top: 21%; width: 14%; }
  .part6 .eachBox1 .ttBox h3 span { font-size: 28px; }
  .part6 .eachBox1 .tdBox .each { padding: 80px 8%; }
  .part6 .eachBox1 .tdBox .each h4 { font-size: 40px; }
  .part6 .eachBox1 .tdBox .each p { padding: 30px 0; }
  .part6 .eachBox1 .tdBox .each p span { display: inline-block; font-size: 18px; }
  .part6 .eachBox1 .tdBox .each p span:after { border-radius: 8px; width: 4px; height: 4px; }
  .part6 .eachBox1 .tdBox .each .btnBox { font-size: 0; padding: 40px 0 0 0; }
  .part6 .eachBox1 .tdBox .each .btnBox a { margin: 0 2%; width: 44%; }
  .part6 .eachBox1 .tdBox .each .btnBox .btn0 { font-size: 20px; height: 80px; border-radius: 40px; }
  .part6 .eachBox1 .tdBox .each .btnBox .btn1 { font-size: 20px; height: 80px; border-radius: 40px; }
  .part6 #svgContainer6_0 { width: 14%; left: -1%; top: -225px; }
  .part6 #svgContainer6_1 { width: 34%; right: -13%; top: -200px; }
  .part6 #svgContainer6_2 { width: 11%; right: -1%; bottom: -225px; } }
@media screen and (max-width: 767px) { .part6 { padding: 50px 0; }
  .part6 .ttBox0 { padding: 9% 0 9% 0; margin: 0 2% 0px 2%; }
  .part6 .ttBox0 .mBlock { display: block; }
  .part6 .ttBox0 h1 { font-size: 32px; line-height: 1em; font-weight: bold; letter-spacing: 0.1em; text-align: left; font-weight: 900; text-justify: inter-ideograph; }
  .part6 .ttBox0 h1 span { font-size: 32px; }
  .part6 .ttBox0 .oo0 { width: 45%; }
  .part6 .ttBox0 .oo0 span img { width: 100%; }
  .part6 .ttBox0 .oo1 { width: 40%; bottom: 5%; }
  .part6 .ttBox0 .oo2 { width: 74%; }
  .part6 .ttBox0 .oo3 { width: 13%; display: none; }
  .part6 .eachBox0 .each { padding: 40px 1% 10px 1%; }
  .part6 .eachBox0 .each h3 { font-size: 16px; font-weight: 700; }
  .part6 .eachBox0 .each p { font-size: 14px; font-weight: 500; }
  .part6 .eachBox1 { margin-top: 20px; }
  .part6 .eachBox1 .ttBox { width: 100%; font-size: 0; }
  .part6 .eachBox1 .ttBox h3 { padding: 10px 0; }
  .part6 .eachBox1 .ttBox h3 span { display: inline-block; font-size: 16px; }
  .part6 .eachBox1 .tdBox .each { padding: 50px 8%; }
  .part6 .eachBox1 .tdBox .each h4 { font-size: 18px; font-weight: 400; margin-bottom: 0.5em; }
  .part6 .eachBox1 .tdBox .each p { padding: 10px 0; }
  .part6 .eachBox1 .tdBox .each p span { display: inline-block; font-size: 14px; }
  .part6 .eachBox1 .tdBox .each p span:after { border-radius: 8px; width: 4px; height: 4px; }
  .part6 .eachBox1 .tdBox .each .btnBox { font-size: 0; padding: 30px 0 0 0; }
  .part6 .eachBox1 .tdBox .each .btnBox a { margin: 0 2%; width: 44%; }
  .part6 .eachBox1 .tdBox .each .btnBox .btn0 { width: 96%; margin: 0px 2% 10px 2%; font-size: 14px; height: 40px; border-radius: 20px; }
  .part6 .eachBox1 .tdBox .each .btnBox .btn1 { width: 96%; margin: 0px 2% 10px 2%; font-size: 14px; height: 40px; border-radius: 20px; }
  .part6 #svgContainer6_0 { width: 15%; left: 0%; top: -100px; }
  .part6 #svgContainer6_1 { width: 34%; right: -13%; top: -100px; }
  .part6 #svgContainer6_2 { width: 15%; right: 0%; bottom: -100px; }
  .part6 .eachBox0 .each h3 { font-size: 18px; }
  .part6 .eachBox0 .each p { font-size: 14px; } }

/*=============================================
=                    part7                   =
=============================================*/
.part7 { padding: 120px 0 0 0; text-align: center; position: relative; width: 100%; background: #fff; z-index: 9; }
.part7 .partWrap { margin: 0 auto; position: relative; z-index: 1; }
.part7 .ttBox0 { text-align: left; position: relative; padding: 60px 0 60px 0; margin: 0 1% 70px 1%; }
.part7 .ttBox0 h2 { font-size: 32px; color: #0F4231; line-height: 1.5em; font-weight: bold; opacity: 0; transition: 1.1s; transform: translateY(10px); }
.part7 .ttBox0 h1 { font-size: 42px; color: #0F4231; line-height: 1em; font-weight: bold; opacity: 0; transition: 1.1s; transform: translateY(10px); letter-spacing: 0.05em; }
.part7 .ttBox0 h1 b { color: #E2BC63; font-size: 130px; padding: 0 0.05em; }
.part7 .ttBox0 .oo0 { width: 327px; overflow: hidden; max-width: 327px; position: absolute; left: 0; top: 0; transition: 1.1s; height: 0; max-height: 136px; }
.part7 .ttBox0 .oo0 span { display: inline-block; vertical-align: top; }
.part7 .ttBox0 .oo3 { width: 63px; overflow: hidden; position: absolute; left: 0%; top: 0px; transition: 1.1s; height: 0; max-height: 316px; margin-left: -31px; margin-top: 160px; max-width: 63px; }
.part7 .ttBox0 .oo3 span { display: inline-block; vertical-align: top; width: 100%; }
.part7 .ttBox0 .oo3 span img { width: 100%; }
.part7 .ttBox0 .oo1 { width: 40%; overflow: hidden; position: absolute; right: 0; bottom: 8%; transition: 1.1s; height: 2px; text-align: left; font-size: 0; }
.part7 .ttBox0 .oo1 span:nth-child(2) { display: inline-block; background: #E2BC63; width: 0%; height: 2px; vertical-align: top; margin-left: 5%; transition: 1.1s; }
.part7 .ttBox0 .oo1 span:nth-child(1) { display: inline-block; background: #E2BC63; width: 0%; height: 2px; vertical-align: top; transition: 1.1s; }
.part7 .ttBox0 .oo2 { width: 70%; overflow: hidden; position: absolute; right: 0; bottom: 0; transition: 1.1s; height: 2px; text-align: left; }
.part7 .ttBox0 .oo2 span { display: inline-block; background: #E2BC63; width: 0%; height: 2px; vertical-align: top; transition: 1.1s; }
.part7 .tableBox { border-top: 1px solid #0F4231; display: block; width: 84%; margin: 0 auto; border-bottom: 1px solid #0F4231; }
.part7 .tableBox .eachTT { display: inline-block; width: 100%; background: #0F4231; padding: 24px 0; text-align: center; }
.part7 .tableBox .eachTT h3 { font-size: 30px; line-height: 1.5em; color: #fff; font-weight: bold; }
.part7 .tableBox .each { padding: 24px 0; font-size: 0; text-align: left; border-bottom: 1px solid #E2BC63; background: #F9F9F9; }
.part7 .tableBox .each:nth-child(2n+1) { background: #fff; }
.part7 .tableBox .each .ttBox { width: 30%; box-sizing: border-box; display: inline-block; }
.part7 .tableBox .each .ttBox h3 { font-size: 20px; color: #0F4231; padding: 0 1em; line-height: 1.5em; display: inline-block; vertical-align: middle; }
.part7 .tableBox .each .tdBox { width: 70%; box-sizing: border-box; display: inline-block; }
.part7 .tableBox .each .tdBox p { font-size: 22px; color: #000; padding: 0 1em; line-height: 1.5em; display: inline-block; vertical-align: middle; }
.part7 .tableBox .each .tdBox a { text-decoration: underline; display: inline-block; color: #0F4231; font-size: 22px; line-height: 1.5em; padding: 0 0em 0 1em; vertical-align: middle; }
.part7.go .ttBox0 h2 { opacity: 1; transform: translateY(0px); }
.part7.go .ttBox0 h1 { opacity: 1; transform: translateY(0px); }
.part7.go .ttBox0 .oo0 { height: 136px; }
.part7.go .ttBox0 .oo3 { height: 316px; }
.part7.go .ttBox0 .oo1 span:nth-child(2) { width: 10%; }
.part7.go .ttBox0 .oo1 span:nth-child(1) { width: 85%; }
.part7.go .ttBox0 .oo2 span { width: 80%; }
@media screen and (max-width: 980px) { .part7 { padding: 100px 0; }
  .part7 .ttBox0 { padding: 7% 0 10% 0; }
  .part7 .ttBox0 .padBlock { display: block; }
  .part7 .ttBox0 .oo3 { margin-top: 21%; width: 14%; } }
@media screen and (max-width: 767px) { .part7 { padding: 100px 0 0 0; }
  .part7 .ttBox0 { padding: 9% 0 9% 0; margin: 0 2% 20px 2%; }
  .part7 .ttBox0 .mBlock { display: block; }
  .part7 .ttBox0 h2 { font-size: 16px; line-height: 1.6em; }
  .part7 .ttBox0 h1 { font-size: 40px; line-height: 1.2em; font-weight: bold; letter-spacing: 0.1em; text-align: left; text-justify: inter-ideograph; }
  .part7 .ttBox0 h1 span { font-size: 40px; }
  .part7 .ttBox0 .oo0 { width: 45%; }
  .part7 .ttBox0 .oo0 span img { width: 100%; }
  .part7 .ttBox0 .oo1 { width: 40%; bottom: 5%; }
  .part7 .ttBox0 .oo2 { width: 74%; }
  .part7 .ttBox0 .oo3 { width: 13%; display: none; }
  .part7 .tableBox { width: 96%; }
  .part7 .tableBox .eachTT h3 { font-size: 18px; letter-spacing: 0.1em; font-weight: 700; }
  .part7 .tableBox .each .ttBox h3 { font-size: 14px; }
  .part7 .tableBox .each .tdBox p { font-size: 14px; }
  .part7 .tableBox .each .tdBox a { font-size: 14px; } }

/*=============================================
=                    part2                    =
=============================================*/
.part2 { padding: 130px 0; text-align: center; position: relative; width: 100%; z-index: 2; background: #f3f5f4; }
.part2 .bgImg0 { width: 100%; position: absolute; left: 0; top: 0; }
.part2 .bgImg0 img { position: absolute; right: 0%; top: 0; display: inline-block; width: 600px; margin: -80px 0 0 0px; }
.part2 .bgImg1 { position: absolute; right: 0; top: 80px; }
.part2 .ttBox1 { text-align: left; position: relative; padding: 0px 0 60px 0; margin: 0 1% 0px 1%; }
.part2 .ttBox1 .h1Box { display: block; position: relative; }
.part2 .ttBox1 .h1Box h1 { font-size: 62px; color: #0F4231; line-height: 1.2em; font-weight: 400; letter-spacing: 0.1px; opacity: 0; transition: 1.1s; transform: translateY(10px); letter-spacing: 0.05em; display: inline-block; vertical-align: middle; background: #f3f5f4; position: relative; z-index: 3; padding-right: 0.5em; }
.part2 .ttBox1 .h1Box .h1_oo1 { width: 0%; overflow: hidden; transition: 1.1s; height: 2px; text-align: left; font-size: 0; font-size: 42px; display: inline-block; z-index: 2; opacity: 0; position: absolute; left: 50%; top: 50%; }
.part2 .ttBox1 .h1Box .h1_oo1 > span:nth-child(2) { display: inline-block; background: #E2BC63; width: 10%; height: 2px; vertical-align: top; transition: 1.1s; margin-left: 5%; }
.part2 .ttBox1 .h1Box .h1_oo1 > span:nth-child(1) { display: inline-block; background: #E2BC63; width: 85%; height: 2px; vertical-align: top; transition: 1.1s; }
.part2 .ttBox1 p { margin-top: 0.5em; font-size: 18px; color: #000; line-height: 1.5em; font-weight: 400; opacity: 0; transition: 1.1s; transform: translateY(10px); }
.part2 .itemBox { display: inline-block; border-radius: 15px; background: #fff; font-size: 0; width: 100%; padding: 55px 2%; box-sizing: border-box; opacity: 0; transition: 1.1s; transform: translateY(20px); }
.part2 .itemBox .circleBox { width: 40%; display: inline-block; vertical-align: middle; background: url(../img/pic2_1.png) no-repeat center center; background-size: contain; text-align: center; padding: 120px 0; text-align: right; }
.part2 .itemBox .circleBox p { font-size: 20px; color: #0F4231; line-height: 1.5em; display: block; text-align: center; font-weight: bold; }
.part2 .itemBox .circleBox .numBox { font-size: 24px; color: #0F4231; display: block; text-align: center; font-weight: bold; }
.part2 .itemBox .circleBox .numBox span { font-size: 100px; display: inline-block; vertical-align: middle; line-height: 1em; }
.part2 .itemBox .circleBox .tk { font-size: 22px; display: inline-block; color: #0F4231; font-weight: bold; padding: 5px 20% 0 0; }
.part2 .itemBox .eachBox { width: 60%; vertical-align: middle; display: inline-block; padding: 0px 2%; box-sizing: border-box; }
.part2 .itemBox .eachBox .each { display: inline-block; padding: 0 1% 0 2%; position: relative; width: 100%; font-size: 0; margin: 0 0 50px 0; }
.part2 .itemBox .eachBox .each .num { display: inline-block; font-size: 96px; vertical-align: middle; line-height: 1em; width: 35%; box-sizing: border-box; position: relative; z-index: 1; color: #0F4231; text-align: center; font-weight: 400; }
.part2 .itemBox .eachBox .each p { display: inline-block; font-size: 22px; vertical-align: middle; line-height: 1.5em; padding-left: 2%; text-align: left; color: #000; width: 65%; box-sizing: border-box; position: relative; z-index: 1; }
.part2 .itemBox .eachBox .each:after { content: ''; background: url(../img/pic2_2.png) no-repeat right center; height: 4px; width: 100%; position: absolute; left: 0; bottom: 18%; z-index: 0; background-size: contain; }
.part2 .itemBox > .aside { font-size: 18px; color: #000; text-align: center; display: block; padding: 1.5em 0 1em 0; }
.part2.go .ttBox1 .h1Box h1 { opacity: 1; transform: translateY(0px); }
.part2.go .ttBox1 .h1Box .h1_oo1 { width: 50%; opacity: 1; }
.part2.go .ttBox1 p { opacity: 1; transform: translateY(0px); }
.part2.go .itemBox { opacity: 1; transform: translateY(0px); }
@media screen and (max-width: 980px) { .part2 { padding: 100px 0; }
  .part2 .bgImg0 { width: 100%; position: absolute; left: 0; top: 0; }
  .part2 .bgImg0 img { width: 50%; margin: -6% 0 0 -25%; max-width: 652px; right: 5%; }
  .part2 .bgImg1 { width: 36px; position: absolute; right: 0; top: 80px; }
  .part2 .ttBox1 { padding: 7% 0 10% 0; }
  .part2 .ttBox1 .padBlock { display: block; }
  .part2 .ttBox1 .h1Box h1 { font-size: 28px; text-align: left; }
  .part2 .ttBox1 p { font-size: 20px; }
  .part2 .itemBox .circleBox { width: 50%; }
  .part2 .itemBox .circleBox p { font-size: 22px; }
  .part2 .itemBox .circleBox .numBox { font-size: 28px; }
  .part2 .itemBox .circleBox .numBox span { font-size: 100px; }
  .part2 .itemBox .circleBox .tk { font-size: 20px; }
  .part2 .itemBox .eachBox { width: 50%; margin: 50px 0 0 0; }
  .part2 .itemBox .eachBox .each .padBlock { display: block; }
  .part2 .itemBox .eachBox .each .num { font-size: 70px; width: 55%; }
  .part2 .itemBox .eachBox .each p { font-size: 16px; width: 45%; }
  .part2 .itemBox > .aside { font-size: 14px; color: #000; text-align: center; display: block; padding: 1.5em 0 1em 0; } }
@media screen and (max-width: 767px) { .part2 { padding: 80px 0 50px 0; }
  .part2 .bgImg0 img { width: 70%; margin: -8% 0 0 -35%; max-width: 652px; }
  .part2 .bgImg1 { width: 28px; position: absolute; right: 0; top: 4%; }
  .part2 .ttBox1 { padding: 9% 0 9% 0; margin: 0 2% 0px 2%; }
  .part2 .ttBox1 .mBlock { display: block; }
  .part2 .ttBox1 .h1Box h1 { font-size: 30px; }
  .part2 .ttBox1 .h1Box .h1_oo1 { display: block; position: relative; width: 0%; left: 0; top: 0; padding: 16px 0; }
  .part2 .ttBox1 p { font-size: 16px; line-height: 1.5em; }
  .part2 .itemBox { padding: 20px 2%; }
  .part2 .itemBox .circleBox { width: 100%; }
  .part2 .itemBox .circleBox p { font-size: 18px; }
  .part2 .itemBox .circleBox .numBox { font-size: 22px; }
  .part2 .itemBox .circleBox .numBox span { font-size: 92px; }
  .part2 .itemBox .circleBox .tk { font-size: 22px; }
  .part2 .itemBox .eachBox { width: 100%; }
  .part2 .itemBox .eachBox .each { margin: 0 0 20px 0; }
  .part2 .itemBox .eachBox .each .padBlock { display: block; }
  .part2 .itemBox .eachBox .each .num { font-size: 66px; width: 40%; }
  .part2 .itemBox .eachBox .each p { font-size: 16px; width: 55%; }
  .part2 .itemBox > .aside { font-size: 14px; text-align: left; width: 96%; margin: 0 auto; }
  .part2.go .ttBox1 .h1Box .h1_oo1 { width: 100%; } }

/*=============================================
=                    part3                    =
=============================================*/
.part3 { padding: 130px 0; text-align: center; position: relative; width: 100%; z-index: 3; background: #fff; }
.part3 .bgImg0 { width: 100%; position: absolute; left: 0; top: 0; }
.part3 .bgImg0 img { position: absolute; left: 0%; top: 0; display: inline-block; width: 600px; margin: -80px 0px 0 0px; }
.part3 .bgImg1 { position: absolute; left: 0; top: 80px; }
.part3 .bg_svgImg { width: 100%; position: absolute; left: 0; top: -53px; }
.part3 .bg_svgImg #bg_svgContainer3_1 { position: absolute; right: 0%; top: 0; display: inline-block; width: 60px; }
.part3 .ttBox1 { text-align: left; position: relative; padding: 60px 0 60px 0; margin: 0 1% 0px 1%; }
.part3 .ttBox1 .h1Box { display: block; position: relative; }
.part3 .ttBox1 .h1Box h1 { font-size: 60px; color: #0F4231; line-height: 1.2em; font-weight: 400; opacity: 0; transition: 1.1s; transform: translateY(10px); letter-spacing: 0.05em; display: inline-block; vertical-align: middle; background: #fff; position: relative; z-index: 3; padding-right: 0.5em; }
.part3 .ttBox1 .h1Box .h1_oo1 { width: 0%; overflow: hidden; transition: 1.1s; height: 2px; text-align: left; font-size: 46px; display: inline-block; z-index: 2; opacity: 0; position: absolute; left: 50%; top: 50%; }
.part3 .ttBox1 .h1Box .h1_oo1 > span:nth-child(2) { display: inline-block; background: #E2BC63; width: 10%; height: 2px; vertical-align: top; transition: 1.1s; margin-left: 5%; }
.part3 .ttBox1 .h1Box .h1_oo1 > span:nth-child(1) { display: inline-block; background: #E2BC63; width: 85%; height: 2px; vertical-align: top; transition: 1.1s; }
.part3 .ttBox1 p { margin-top: 0.5em; font-size: 18px; color: #000; line-height: 1.5em; font-weight: 400; opacity: 0; transition: 1.1s; transform: translateY(10px); }
.part3 .eachBox { display: block; margin: 0 auto; font-size: 0; opacity: 0; transition: 1.1s; transform: translateY(20px); }
.part3 .eachBox .each { width: 25%; padding: 10px 2%; box-sizing: border-box; display: inline-block; }
.part3 .eachBox .each h3 { width: 100%; text-align: center; font-size: 16px; line-height: 2em; border: 1px solid #E2BC63; border-radius: 1em; color: #000; }
.part3 .eachBox .circleBox { margin: 30px 0; width: 100%; display: inline-block; text-align: center; position: relative; }
.part3 .eachBox .circleBox .bgCircle { width: 90%; padding-top: 90%; position: absolute; height: 0%; left: 5%; top: 5%; z-index: 0; }
.part3 .eachBox .circleBox .bgCircle .topCircle { width: 100%; position: absolute; height: 100%; left: 0; top: 0; border-radius: 50%; border: 1px solid #0F4231; }
.part3 .eachBox .circleBox .bgCircle .topCircle span { width: 110%; height: 110%; position: absolute; left: -5%; top: -5%; transition: 1.1s; transform: rotate(-180deg); opacity: 0; }
.part3 .eachBox .circleBox .bgCircle .topCircle.c0 span { background: url(../img/part3_0.png) no-repeat center center; background-size: contain; }
.part3 .eachBox .circleBox .bgCircle .topCircle.c1 span { background: url(../img/part3_1.png) no-repeat center center; background-size: contain; }
.part3 .eachBox .circleBox .bgCircle .topCircle.c2 span { background: url(../img/part3_2.png) no-repeat center center; background-size: contain; }
.part3 .eachBox .circleBox .bgCircle .topCircle.c3 span { background: url(../img/part3_3.png) no-repeat center center; background-size: contain; }
.part3 .eachBox .circleBox .svgImg { width: 56%; display: inline-block; padding: 20% 22%; }
.part3 .eachBox .circleBox .svgImg > * { width: 100%; }
.part3 .eachBox .box > img { width: 20%; display: inline-block; vertical-align: middle; max-width: 36px; -webkit-animation: dave 1.5s infinite; animation: dave 1.5s infinite; }
.part3 .eachBox .box span { font-size: 22px; line-height: 1em; display: inline-block; vertical-align: middle; color: #0F4231; padding: 0 2%; }
.part3 .eachBox .box p { font-size: 58px; line-height: 1em; display: inline-block; vertical-align: middle; color: #0F4231; }
.part3 .aside { font-size: 16px; color: #000; text-align: center; display: block; padding: 2.5em 0 2em 0; }
.part3.go .ttBox1 .h1Box h1 { opacity: 1; transform: translateY(0px); }
.part3.go .ttBox1 .h1Box .h1_oo1 { width: 50%; opacity: 1; }
.part3.go .ttBox1 p { opacity: 1; transform: translateY(0px); }
.part3.go .eachBox { opacity: 1; transform: translateY(0px); }
.part3.go .eachBox .circleBox .bgCircle .topCircle span { transform: rotate(0deg); opacity: 1; }
@media screen and (max-width: 980px) { .part3 { padding: 100px 0; }
  .part3 .bgImg0 { width: 100%; position: absolute; left: 0; top: 0; }
  .part3 .bgImg0 img { width: 50%; margin: -6% 0 0 0%; max-width: 652px; left: 5%; }
  .part3 .bgImg1 { width: 36px; }
  .part3 .ttBox1 { padding: 7% 0 10% 0; }
  .part3 .ttBox1 .padBlock { display: block; }
  .part3 .ttBox1 .h1Box h1 { font-size: 58px; text-align: left; }
  .part3 .ttBox1 p { font-size: 20px; }
  .part3 .eachBox .each { padding: 10px 1%; }
  .part3 .eachBox .each h3 { font-size: 14px; }
  .part3 .eachBox .circleBox { margin: 30px 0; width: 100%; display: inline-block; text-align: center; position: relative; }
  .part3 .eachBox .circleBox .bgCircle { width: 90%; padding-top: 90%; position: absolute; height: 0%; left: 5%; top: 5%; z-index: 0; }
  .part3 .eachBox .circleBox .bgCircle .topCircle { width: 100%; position: absolute; height: 100%; left: 0; top: 0; border-radius: 50%; border: 1px solid #0F4231; }
  .part3 .eachBox .circleBox .bgCircle .topCircle span { width: 110%; height: 110%; position: absolute; left: -5%; top: -5%; }
  .part3 .eachBox .circleBox .bgCircle .topCircle.c0 span { background: url(../img/part3_0.png) no-repeat center center; background-size: contain; }
  .part3 .eachBox .circleBox .bgCircle .topCircle.c1 span { background: url(../img/part3_1.png) no-repeat center center; background-size: contain; transition: 1.1s; }
  .part3 .eachBox .circleBox .bgCircle .topCircle.c2 span { background: url(../img/part3_2.png) no-repeat center center; background-size: contain; transition: 1.1s; }
  .part3 .eachBox .circleBox .bgCircle .topCircle.c3 span { background: url(../img/part3_3.png) no-repeat center center; background-size: contain; transition: 1.1s; }
  .part3 .eachBox .circleBox .svgImg { width: 63%; display: inline-block; padding: 30px 15%; }
  .part3 .eachBox .circleBox .svgImg > * { width: 100%; }
  .part3 .eachBox .box > img { width: 20%; display: inline-block; vertical-align: middle; max-width: 36px; }
  .part3 .eachBox .box span { font-size: 22px; line-height: 1em; display: inline-block; vertical-align: middle; color: #0F4231; padding: 0 2%; }
  .part3 .eachBox .box p { font-size: 58px; line-height: 1em; display: inline-block; vertical-align: middle; color: #0F4231; }
  .part3 .aside { font-size: 14px; color: #000; text-align: center; display: block; padding: 1.5em 0 1em 0; } }
@media screen and (max-width: 767px) { .part3 { padding: 80px 0 50px 0; }
  .part3 .bgImg0 img { width: 70%; margin: -8% 0 0 0%; max-width: 652px; }
  .part3 .bgImg1 { width: 28px; position: absolute; right: 0; top: 4%; }
  .part3 .ttBox1 { padding: 9% 0 9% 0; margin: 0 2% 0px 2%; }
  .part3 .ttBox1 .mBlock { display: block; }
  .part3 .ttBox1 .h1Box h1 { font-size: 30px; }
  .part3 .ttBox1 .h1Box .h1_oo1 { display: block; position: relative; width: 0%; left: 0; top: 0; padding: 16px 0; }
  .part3 .ttBox1 p { font-size: 16px; line-height: 1.5em; }
  .part3 .eachBox .each { padding: 10px 3% 10px 3%; width: 50%; margin-bottom: 50px; }
  .part3 .eachBox .each h3 { font-size: 12px; }
  .part3 .eachBox .each .circleBox { margin: 20px 0 20px 0; }
  .part3 .eachBox .box img { width: 10%; }
  .part3 .eachBox .box span { font-size: 16px; }
  .part3 .eachBox .box p { font-size: 32px; }
  .part3 .aside { font-size: 14px; text-align: left; width: 96%; margin: 0 auto; }
  .part3.go .ttBox1 .h1Box .h1_oo1 { width: 100%; } }

/*=============================================
=                    part4                    =
=============================================*/
.part4 { padding: 130px 0; text-align: center; position: relative; width: 100%; z-index: 5; background: #f3f5f4; }
.part4 .bgImg0 { width: 100%; position: absolute; left: 0; top: 0; }
.part4 .bgImg0 img { position: absolute; right: 0%; top: 0; display: inline-block; width: 600px; margin: -80px 0px 0 0px; }
.part4 .bgImg1 { position: absolute; right: 0; top: 80px; }
.part4 .bg_svgImg { width: 100%; position: absolute; left: 0; top: -53px; }
.part4 .bg_svgImg #bg_svgContainer4_1 { position: absolute; left: 0%; top: 0; display: inline-block; width: 60px; }
.part4 .ttBox1 { text-align: left; position: relative; padding: 60px 0 60px 0; margin: 0 1% 0px 1%; }
.part4 .ttBox1 .h1Box { display: block; position: relative; }
.part4 .ttBox1 .h1Box h1 { font-size: 64px; color: #0F4231; line-height: 1.2em; font-weight: 400; opacity: 0; transition: 1.1s; transform: translateY(10px); letter-spacing: 0.05em; display: inline-block; vertical-align: middle; background: #f3f5f4; position: relative; z-index: 3; padding-right: 0.5em; }
.part4 .ttBox1 .h1Box .h1_oo1 { width: 0%; overflow: hidden; transition: 1.1s; height: 2px; text-align: left; font-size: 46px; display: inline-block; z-index: 2; opacity: 0; position: absolute; left: 50%; top: 50%; }
.part4 .ttBox1 .h1Box .h1_oo1 > span:nth-child(2) { display: inline-block; background: #E2BC63; width: 10%; height: 2px; vertical-align: top; transition: 1.1s; margin-left: 5%; }
.part4 .ttBox1 .h1Box .h1_oo1 > span:nth-child(1) { display: inline-block; background: #E2BC63; width: 85%; height: 2px; vertical-align: top; transition: 1.1s; }
.part4 .ttBox1 p { margin-top: 0.5em; font-size: 18px; color: #000; line-height: 1.5em; font-weight: 400; opacity: 0; transition: 1.1s; transform: translateY(10px); }
.part4 .itemBox { background: #fff; border-radius: 24px; margin: 0px 0 50px 0; font-size: 0; position: relative; text-align: left; opacity: 0; transition: 1.1s; transform: translateY(20px); }
.part4 .itemBox .itemBox_left { width: 50%; display: inline-block; }
.part4 .itemBox .itemBox_left .box0 { border-radius: 24px 24px 0 24px; border: 1px solid #E2BC63; text-align: left; font-size: 0; background: #E2BC63; box-sizing: border-box; position: relative; }
.part4 .itemBox .itemBox_left .box0 .lBox { width: 70%; display: inline-block; padding: 36px 15% 36px 10%; position: relative; box-sizing: border-box; border-radius: 24px 0 0 24px; border: 1px solid #E2BC63; text-align: center; vertical-align: top; background: #fff; }
.part4 .itemBox .itemBox_left .box0 .lBox .svgImg { width: 50%; max-width: 192px; display: inline-block; padding: 24px 0; }
.part4 .itemBox .itemBox_left .box0 .lBox .svgImg > * { width: 100%; }
.part4 .itemBox .itemBox_left .box0 .lBox h4 { font-size: 30px; line-height: 1.5em; color: #000; font-weight: bold; }
.part4 .itemBox .itemBox_left .box0 .lBox p { font-size: 16px; line-height: 1.5em; color: #000; }
.part4 .itemBox .itemBox_left .box0 .lBox > img { position: absolute; right: 5%; top: 50%; margin: -20px 0 0 -20px; width: 40px; }
.part4 .itemBox .itemBox_left .box0 .rBox { width: 30%; display: inline-block; font-size: 0; text-align: center; vertical-align: top; height: 100%; position: absolute; right: 0; top: 0; }
.part4 .itemBox .itemBox_left .box0 .rBox:after { content: ''; width: 0; height: 100%; display: inline-block; vertical-align: middle; }
.part4 .itemBox .itemBox_left .box0 .rBox .middleBox { width: 100%; display: inline-block; vertical-align: middle; }
.part4 .itemBox .itemBox_left .box0 .rBox p { color: #fff; line-height: 1.5em; font-size: 30px; font-weight: bold; text-shadow: 2px 2px 5px #444; }
.part4 .itemBox .itemBox_left .box0 .rBox span { color: #fff; line-height: 1.5em; font-size: 16px; text-shadow: 2px 2px 5px #444; }
.part4 .itemBox .itemBox_left .box1 { border-radius: 0px 0px 24px 24px; background: #fff; text-align: left; font-size: 0; box-sizing: border-box; position: relative; }
.part4 .itemBox .itemBox_left .box1 .lBox { width: 70%; display: inline-block; padding: 36px 0% 36px 0; position: relative; box-sizing: border-box; text-align: center; vertical-align: top; border-right: 2px solid #E2BC63; }
.part4 .itemBox .itemBox_left .box1 .lBox .eachBox { display: inline-block; vertical-align: middle; width: 85%; box-sizing: border-box; padding: 0 0% 0 5%; }
.part4 .itemBox .itemBox_left .box1 .lBox .eachBox .each { display: inline-block; width: 100%; padding: 20px 0; font-size: 0; }
.part4 .itemBox .itemBox_left .box1 .lBox .eachBox .each .svgImg { width: 30%; display: inline-block; vertical-align: middle; padding: 24px 0; }
.part4 .itemBox .itemBox_left .box1 .lBox .eachBox .each .svgImg > div { width: 100%; }
.part4 .itemBox .itemBox_left .box1 .lBox .eachBox .each .svgImg > div svg { vertical-align: middle; }
.part4 .itemBox .itemBox_left .box1 .lBox .eachBox .each p { width: 70%; display: inline-block; text-align: left; vertical-align: middle; font-size: 16px; line-height: 1.5em; color: #000; padding: 0 0% 0 5%; box-sizing: border-box; }
.part4 .itemBox .itemBox_left .box1 .lBox > img { width: 10%; margin: 0 3% 0 2%; display: inline-block; vertical-align: middle; }
.part4 .itemBox .itemBox_left .box1 .rBox { width: 30%; display: inline-block; font-size: 0; text-align: center; vertical-align: top; height: 100%; position: absolute; right: 0; top: 0; background: #E2BC63; box-sizing: border-box; border-radius: 0px 0 24px 0px; border: 1px solid #E2BC63; text-align: center; }
.part4 .itemBox .itemBox_left .box1 .rBox > img { width: 80%; display: inline-block; vertical-align: middle; }
.part4 .itemBox .itemBox_left .box1 .rBox:after { width: 0; height: 100%; display: inline-block; content: ''; vertical-align: middle; }
.part4 .itemBox .itemBox_right { width: 50%; display: inline-block; height: 100%; font-size: 0; position: absolute; right: 0; top: 0; }
.part4 .itemBox .itemBox_right:after { content: ''; width: 0; height: 100%; display: inline-block; vertical-align: middle; }
.part4 .itemBox .itemBox_right .articleBox { display: inline-block; vertical-align: middle; width: 100%; box-sizing: border-box; padding: 0 5%; text-align: left; }
.part4 .itemBox .itemBox_right .pad50 { width: 100%; }
.part4 .itemBox .itemBox_right h3 { font-size: 34px; text-align: left; line-height: 1.5em; display: block; border-bottom: 1px solid #E2BC63; padding: 0 0 0.5em 0; margin: 0 0 0.5em; color: #0F4231; }
.part4 .itemBox .itemBox_right p { font-size: 22px; line-height: 1.5em; display: block; color: #000; text-align: left; }
.part4 .itemBox .itemBox_right img { width: 100%; display: inline-block; margin: 30px 0 30px 0; max-width: 540px; }
.part4 .aside { font-size: 16px; text-align: center; width: 96%; margin: 0 auto; }
.part4.go .ttBox1 .h1Box h1 { opacity: 1; transform: translateY(0px); }
.part4.go .ttBox1 .h1Box .h1_oo1 { width: 50%; opacity: 1; }
.part4.go .ttBox1 p { opacity: 1; transform: translateY(0px); }
.part4.go .itemBox { opacity: 1; transform: translateY(0px); }
@media screen and (max-width: 980px) { .part4 { padding: 100px 0; }
  .part4 .bgImg0 { width: 100%; position: absolute; left: 0; top: 0; }
  .part4 .bgImg0 img { width: 50%; margin: -6% 0 0 0%; max-width: 652px; right: 5%; }
  .part4 .bgImg1 { width: 36px; }
  .part4 .ttBox1 { padding: 7% 0 10% 0; }
  .part4 .ttBox1 .padBlock { display: block; }
  .part4 .ttBox1 .h1Box h1 { font-size: 58px; text-align: left; }
  .part4 .ttBox1 p { font-size: 20px; }
  .part4 .itemBox .itemBox_left { width: 100%; }
  .part4 .itemBox .itemBox_left .box1 .lBox .eachBox .each p { font-size: 18px; }
  .part4 .itemBox .itemBox_right { width: 100%; position: relative; right: 0; top: 0; height: auto; padding: 50px 0; }
  .part4 .itemBox .itemBox_right .pad50 { width: 40%; display: inline-block; vertical-align: middle; }
  .part4 .itemBox .itemBox_right h3 { font-size: 28px; }
  .part4 .itemBox .itemBox_right p { font-size: 18px; }
  .part4 .itemBox .itemBox_right img { width: 58%; margin: 0px 0 0px 2%; vertical-align: middle; display: inline-block; } }
@media screen and (max-width: 767px) { .part4 { padding: 80px 0 50px 0; }
  .part4 .bgImg0 img { width: 70%; margin: -8% 0 0 -35%; max-width: 652px; }
  .part4 .bgImg1 { width: 28px; position: absolute; right: 0; top: 4%; }
  .part4 .ttBox1 { padding: 9% 0 9% 0; margin: 0 2% 0px 2%; }
  .part4 .ttBox1 .mBlock { display: block; }
  .part4 .ttBox1 .h1Box h1 { font-size: 30px; }
  .part4 .ttBox1 .h1Box .h1_oo1 { display: block; position: relative; width: 0%; left: 0; top: 0; padding: 16px 0; }
  .part4 .ttBox1 p { font-size: 16px; line-height: 1.5em; }
  .part4 .itemBox { padding: 0 0 20px 0; }
  .part4 .itemBox .itemBox_left .box0 .lBox { width: 60%; padding: 36px 5% 36px 2%; }
  .part4 .itemBox .itemBox_left .box0 .lBox h4 { font-size: 22px; }
  .part4 .itemBox .itemBox_left .box0 .lBox p { font-size: 14px; }
  .part4 .itemBox .itemBox_left .box0 .lBox > img { width: 22px; }
  .part4 .itemBox .itemBox_left .box0 .rBox { width: 40%; }
  .part4 .itemBox .itemBox_left .box0 .rBox p { font-size: 22px; }
  .part4 .itemBox .itemBox_left .box0 .rBox span { font-size: 18px; }
  .part4 .itemBox .itemBox_left .box1 .lBox { width: 60%; padding: 36px 0% 36px 0%; background: url(../img/pic4_2.png) no-repeat right center; }
  .part4 .itemBox .itemBox_left .box1 .lBox .eachBox { padding-left: 0; padding-right: 8%; }
  .part4 .itemBox .itemBox_left .box1 .lBox .eachBox .each { padding: 6px 0; }
  .part4 .itemBox .itemBox_left .box1 .lBox .eachBox .each .svgImg { width: 80%; display: block; margin: 0 auto; }
  .part4 .itemBox .itemBox_left .box1 .lBox .eachBox .each p { width: 98%; padding: 0; font-size: 13px; text-align: center; }
  .part4 .itemBox .itemBox_left .box1 .lBox > img { height: 80%; display: none; }
  .part4 .itemBox .itemBox_left .box1 .rBox { width: 40%; }
  .part4 .itemBox .itemBox_right { width: 100%; position: relative; right: 0; top: 0; height: auto; padding: 50px 0 0 0; }
  .part4 .itemBox .itemBox_right .pad50 { width: 100%; }
  .part4 .itemBox .itemBox_right h3 { font-size: 22px; }
  .part4 .itemBox .itemBox_right p { font-size: 16px; }
  .part4 .itemBox .itemBox_right img { width: 100%; margin: 50px 0 50px 0%; }
  .part4.go .ttBox1 .h1Box .h1_oo1 { width: 100%; }
  .part4 .aside { font-size: 14px; padding-bottom: 30px; } }

/*=============================================
=                    part5                    =
=============================================*/
.part5 { padding: 130px 0 130px 0; text-align: center; position: relative; width: 100%; z-index: 6; background: #fff; }
.part5 .bgImg0 { width: 100%; position: absolute; left: 0; top: 0; }
.part5 .bgImg0 img { position: absolute; left: 0%; top: 0; display: inline-block; width: 600px; margin: -80px 0px 0 0px; }
.part5 .bgImg1 { position: absolute; left: 0; top: 80px; }
.part5 .bg_svgImg { width: 100%; position: absolute; left: 0; top: -53px; }
.part5 .bg_svgImg #bg_svgContainer5_1 { position: absolute; right: 0%; top: 0; display: inline-block; width: 60px; }
.part5 .ttBox1 { text-align: left; position: relative; padding: 60px 0 60px 0; margin: 0 1% 0px 1%; }
.part5 .ttBox1 .h1Box { display: block; position: relative; }
.part5 .ttBox1 .h1Box h1 { font-size: 64px; color: #0F4231; line-height: 1.2em; font-weight: 400; opacity: 0; transition: 1.1s; transform: translateY(10px); letter-spacing: 0.05em; display: inline-block; vertical-align: middle; background: #fff; position: relative; z-index: 3; padding-right: 0.5em; }
.part5 .ttBox1 .h1Box .h1_oo1 { width: 0%; overflow: hidden; -moz-transition: 1.1s 0.3s; -o-transition: 1.1s 0.3s; -webkit-transition: 1.1s; -webkit-transition-delay: 0.3s; transition: 1.1s 0.3s; height: 2px; text-align: left; font-size: 46px; display: inline-block; z-index: 2; opacity: 0; position: absolute; left: 50%; top: 50%; }
.part5 .ttBox1 .h1Box .h1_oo1 > span:nth-child(2) { display: inline-block; background: #E2BC63; width: 10%; height: 2px; vertical-align: top; transition: 1.1s; margin-left: 5%; }
.part5 .ttBox1 .h1Box .h1_oo1 > span:nth-child(1) { display: inline-block; background: #E2BC63; width: 85%; height: 2px; vertical-align: top; transition: 1.1s; }
.part5 .ttBox1 p { margin-top: 0.5em; font-size: 18px; color: #000; line-height: 1.5em; font-weight: 400; opacity: 0; transition: 1.1s; transform: translateY(10px); }
.part5 .tableBox { display: block; width: 100%; margin: 0 auto; opacity: 0; transition: 1.1s; transform: translateY(20px); }
.part5 .tableBox .eachTT { width: 100%; }
.part5 .tableBox .eachTT .each { font-size: 0; text-align: left; border-top: 2px solid #0F4231; border-bottom: 2px solid #0F4231; background: #fff; }
.part5 .tableBox .eachTT .ttBox0 { width: 28%; display: inline-block; padding: 8px 0; box-sizing: border-box; }
.part5 .tableBox .eachTT .tdBox1 { width: 28%; display: inline-block; box-sizing: border-box; }
.part5 .tableBox .eachTT .tdBox2 { width: 28%; display: inline-block; box-sizing: border-box; }
.part5 .tableBox .eachTT .tdBox3 { width: 14%; display: inline-block; box-sizing: border-box; }
.part5 .tableBox .eachTT h3 { font-size: 20px; line-height: 1.5em; color: #0F4231; font-weight: bold; padding: 0 1em; }
.part5 .tableBox .eachTD { font-size: 0; text-align: left; width: 100%; }
.part5 .tableBox .eachTD .each { font-size: 0; text-align: left; border-bottom: 1px solid #E2BC63; background: #F9F9F9; width: 100%; }
.part5 .tableBox .eachTD .each:nth-child(2n) { background: #fff; }
.part5 .tableBox .eachTD .ttBox0 { width: 28%; display: inline-block; padding: 24px 0; box-sizing: border-box; vertical-align: middle; }
.part5 .tableBox .eachTD .tdBox1 { width: 28%; display: inline-block; padding: 24px 0; box-sizing: border-box; vertical-align: middle; }
.part5 .tableBox .eachTD .tdBox2 { width: 28%; display: inline-block; padding: 24px 0; box-sizing: border-box; vertical-align: middle; }
@-webkit-keyframes rotate20 { 0%, 100% { transform: rotate(5deg); }
  10%, 90% { transform: rotate(-5deg); }
  30%, 70% { transform: rotate(-5deg); }
  50% { transform: rotate(-5deg); } }
@keyframes rotate20 { 0%, 100% { transform: rotate(5deg); }
  10%, 90% { transform: rotate(-5deg); }
  30%, 70% { transform: rotate(-5deg); }
  50% { transform: rotate(-5deg); } }
.part5 .tableBox .eachTD .tdBox3 { width: 14%; display: inline-block; padding: 24px 0; box-sizing: border-box; vertical-align: middle; text-align: center; }
.part5 .tableBox .eachTD .tdBox3 > img { display: inline-block; width: 50%; max-width: 42px; -webkit-animation: rotate20 1.5s infinite; animation: rotate20 1.5s infinite; }
.part5 .tableBox .eachTD p { font-size: 20px; line-height: 1.5em; color: #000; padding: 0 1em; }
.part5 .tableBox .eachTD b { font-size: 26px; line-height: 1.5em; font-weight: bold; color: #0F4231; }
.part5.go .ttBox1 .h1Box h1 { opacity: 1; transform: translateY(0px); }
.part5.go .ttBox1 .h1Box .h1_oo1 { width: 50%; opacity: 1; }
.part5.go .ttBox1 p { opacity: 1; transform: translateY(0px); }
.part5.go .tableBox { opacity: 1; transform: translateY(0px); }
@media screen and (max-width: 980px) { .part5 { padding: 100px 0; }
  .part5 .bgImg0 { width: 100%; position: absolute; left: 0; top: 0; }
  .part5 .bgImg0 img { width: 50%; margin: -6% 0 0 0%; max-width: 652px; left: 5%; }
  .part5 .bgImg1 { width: 36px; }
  .part5 .ttBox1 { padding: 7% 0 10% 0; }
  .part5 .ttBox1 .padBlock { display: block; }
  .part5 .ttBox1 .h1Box h1 { font-size: 58px; text-align: left; }
  .part5 .ttBox1 p { font-size: 20px; }
  .part5 .tableBox { width: 96%; }
  .part5 .tableBox .eachTT h3 { font-size: 18px; }
  .part5 .tableBox .eachTD p { font-size: 18px; }
  .part5 .tableBox .eachTD b { font-size: 22px; } }
@media screen and (max-width: 767px) { .part5 { padding: 80px 0 50px 0; }
  .part5 .bgImg0 img { width: 70%; margin: -8% 0 0 0%; max-width: 652px; }
  .part5 .bgImg1 { width: 28px; position: absolute; right: 0; top: 4%; }
  .part5 .ttBox1 { padding: 9% 0 9% 0; margin: 0 2% 0px 2%; }
  .part5 .ttBox1 .mBlock { display: block; }
  .part5 .ttBox1 .h1Box h1 { font-size: 30px; }
  .part5 .ttBox1 .h1Box .h1_oo1 { display: block; position: relative; width: 0%; left: 0; top: 0; padding: 16px 0; }
  .part5 .ttBox1 p { font-size: 16px; line-height: 1.5em; }
  .part5 .tableBox .eachTT h3 { font-size: 14px; padding: 0 0.2em; }
  .part5 .tableBox .eachTD p { font-size: 14px; padding: 0 0.2em; }
  .part5 .tableBox .eachTD b { font-size: 16px; }
  .part5.go .ttBox1 .h1Box .h1_oo1 { width: 100%; } }

/*=============================================
=                    part8                    =
=============================================*/
.part8 { padding: 0px 0 0px 0; text-align: center; position: relative; width: 100%; overflow: hidden; z-index: 1; background: #fff; }
.part8 .ttBox1 { text-align: left; position: relative; padding: 60px 0 60px 0; margin: 0 1% 0px 1%; }
.part8 .ttBox1 .h1Box { display: block; position: relative; }
.part8 .ttBox1 .h1Box h1 { font-size: 64px; color: #0F4231; line-height: 1.2em; font-weight: 400; opacity: 0; transition: 1.1s; transform: translateY(10px); letter-spacing: 0.05em; display: inline-block; vertical-align: middle; background: #fff; position: relative; z-index: 3; padding-right: 0.5em; }
.part8 .ttBox1 .h1Box .h1_oo1 { width: 0%; overflow: hidden; -moz-transition: 1.1s 0.3s; -o-transition: 1.1s 0.3s; -webkit-transition: 1.1s; -webkit-transition-delay: 0.3s; transition: 1.1s 0.3s; height: 2px; text-align: left; font-size: 46px; display: inline-block; z-index: 2; opacity: 0; position: absolute; left: 20%; top: 50%; }
.part8 .ttBox1 .h1Box .h1_oo1 > span:nth-child(2) { display: inline-block; background: #E2BC63; width: 8%; height: 2px; vertical-align: top; transition: 1.1s; margin-left: 4%; }
.part8 .ttBox1 .h1Box .h1_oo1 > span:nth-child(1) { display: inline-block; background: #E2BC63; width: 88%; height: 2px; vertical-align: top; transition: 1.1s; }
.part8 .ttBox1 p { margin-top: 0.5em; font-size: 18px; color: #000; line-height: 1.5em; font-weight: 400; opacity: 0; transition: 1.1s; transform: translateY(10px); }
.part8.go .ttBox1 .h1Box h1 { opacity: 1; transform: translateY(0px); }
.part8.go .ttBox1 .h1Box .h1_oo1 { width: 80%; opacity: 1; }
.part8.go .ttBox1 p { opacity: 1; transform: translateY(0px); }
.part8 .tableBox { border-top: 1px solid #0F4231; display: block; width: 90%; margin: 0 auto; border-bottom: 1px solid #0F4231; }
.part8 .tableBox .each { padding: 24px 0; font-size: 0; text-align: left; border-bottom: 1px solid #E2BC63; background: #F9F9F9; }
.part8 .tableBox .each:nth-child(2n) { background: #fff; }
.part8 .tableBox .each .ttBox { width: 30%; box-sizing: border-box; display: inline-block; }
.part8 .tableBox .each .ttBox h3 { font-size: 18px; color: #000; padding: 0 1em; line-height: 1.5em; display: inline-block; vertical-align: middle; font-weight: 400; }
.part8 .tableBox .each .tdBox { width: 70%; box-sizing: border-box; display: inline-block; }
.part8 .tableBox .each .tdBox p { font-size: 18px; color: #000; padding: 0 1em; line-height: 1.5em; display: inline-block; vertical-align: middle; font-weight: 400; }
@media screen and (max-width: 980px) { .part8 { padding: 0px 0 100px 0; }
  .part8 .ttBox1 { padding: 7% 0 10% 0; }
  .part8 .ttBox1 .padBlock { display: block; }
  .part8 .ttBox1 .h1Box h1 { font-size: 58px; text-align: left; }
  .part8 .ttBox1 p { font-size: 20px; }
  .part8 .tableBox { width: 96%; } }
@media screen and (max-width: 767px) { .part8 { padding: 0px 0 70px 0; }
  .part8 .ttBox1 { padding: 9% 0 9% 0; margin: 0 2% 0px 2%; }
  .part8 .ttBox1 .mBlock { display: block; }
  .part8 .ttBox1 .h1Box h1 { font-size: 32px; }
  .part8 .ttBox1 .h1Box .h1_oo1 { display: block; position: relative; width: 0%; left: 0; top: 0; padding: 16px 0; }
  .part8 .ttBox1 p { font-size: 18px; line-height: 1.5em; }
  .part8 .tableBox .each .ttBox h3 { font-size: 16px; }
  .part8 .tableBox .each .tdBox p { font-size: 16px; }
  .part8.go .ttBox1 .h1Box .h1_oo1 { width: 100%; } }

/*=============================================
=                    ex                   =
=============================================*/
.ex { padding: 130px 0; }

/*=============================================
=                    footer                    =
=============================================*/
.footer { position: relative; width: 100%; display: block; }

.footer .arcitleBox1 { position: relative; text-align: left; padding: 96px 2%; font-size: 0; background: #F2F2F2; }
.footer .arcitleBox1 h4 { display: block; font-size: 16px; color: #000; line-height: 1.6em; text-align: justify; text-justify: inter-ideograph; padding: 0 0 1em 0; }
.footer .arcitleBox1 p { display: block; font-size: 16px; color: #000; line-height: 1.6em; text-align: justify; text-justify: inter-ideograph; font-weight: 500;}

.footer .arcitleBox2 { display: block; position: relative; text-align: center; padding: 36px 2%; background: #0F4231; }
.footer .arcitleBox2 p { display: inline-block; font-size: 18px; color: #fff; line-height: 1.5em; margin: 0; }

.footer-topBtn { display: inline-block; width: 50px; height: 50px; background: url(../img/top@2x.png) no-repeat center center; background-size: cover; position: absolute; right: -8%; bottom: 100px; }

@media screen and (max-width: 980px) { .footer-topBtn { position: absolute; right: 5%; bottom: inherit; top: -60px; } }
@media screen and (max-width: 767px) { .footer-topBtn { position: absolute; right: 5%; bottom: inherit; top: -60px; }
  .footer .arcitleBox2 { padding: 36px 2% ; }
  .footer .arcitleBox2 p { font-size: 14px; } }
body, html { min-height: 100%; }