@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@100..900&display=swap');
/* CSS reset*/
html, body, div, dl, dt, dd, ul, ol, li, h1, .GN_wrap h2, h3, h4, h5, h6, pre, form, fieldset, textarea, .GN_wrap p, blockquote, th, td, footer, img {
	margin: 0;
	padding: 0;
	border: 0;
}

* {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

a, div, li {
	-webkit-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

a, div, li:hover {
	-webkit-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

ul, li {
  	list-style: none;
}

.l-content__main,
.l-content__container {
	padding-right: 0;
	padding-left: 0;
}
.l-content__main {
	width: 100%;
	max-width: 1280px;
}
.l-content__main-top {
	margin: 0;
	padding: 0;
}
.l-content__title {
	display: none !important;
}
.c-breadcrumbs__list {
	display: none;
}
.c-form__legend {
	display: none !important;
}
.l-content {
	z-index: 2;
	top: 0;	right: 0; left: 0; bottom: 0;
}

.pc {
  	display: block;
}
.mb {
  	display: none;
}
@media (max-width: 750px) {
	.pc {
		display: none !important;
	}
	.mb {
		display: block;
	}
}

.p-relative {
  	position: relative;
}
.p-absolute {
  	position: absolute;
}

html, body, div, span, applet, object, iframe, h1, .GN_wrap h2, h3, h4, h5, h6, .GN_wrap p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  font-family: "Microsoft JhengHei", "微軟正黑體", serif !important;
  margin: 0;
  padding: 0;
  border: 0;
  vertical-align: baseline;
  line-height: normal;
  font-weight: normal;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block;
}
.GN_wrap ol,
.GN_wrap ul {
  list-style: none;
}
.GN_wrap blockquote,
.GN_wrap q {
  quotes: none;
}
.GN_wrap blockquote:before,
.GN_wrap blockquote:after,
.GN_wrap q:before,
.GN_wrap q:after {
  content: "";
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
.GN_wrap a,
.GN_wrap a:hover,
.GN_wrap a:focus,
.GN_wrap a:active {
  text-decoration: none;
}
input:focus,
a:focus,
a:active {
  outline: none;
}
img {
  max-width: 100%;
  vertical-align: middle;
  pointer-events: none;
}
svg {
  width: 100%;
}

.color-text {
	background: -webkit-linear-gradient(left, #fff 0%, #fff 24%, #a6cdff 36%, #fff 46%, #fff 52%, #a6cdff 58%, #fff 67%, #fff 100%);
	background-size: 400% 400%;
	background-clip: text;
	-webkit-background-clip: -webkit-text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	text-fill-color: transparent;
	animation-name: colorText;
	animation-duration: 8s;
	animation-timing-function: ease;
	animation-iteration-count: infinite;
}
@keyframes colorText {
	0% {
		background-position: 0 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0 50%;
	}
}

body,
html {
	font-size: 1rem;
	line-height: 1.5;
}
.h2, .h3, .h4, .h5 {
	display: block;
	letter-spacing: 0.05em;
}
.GN_wrap .h2 {
  	font-size: 52px !important;
}
.GN_wrap .h3 {
  	font-size: 38px !important;
}
.GN_wrap .h4 {
  	font-size: 28px !important;
}
.GN_wrap img {
	width: 100%;
	max-width: 100%;
	vertical-align: middle;
}
.GN_wrap p {
	font-size: 18px;
	text-align: justify;
	text-justify: inter-ideograph;
}
small {
  	font-size: 12px;
}
sup {
	font-size: 60% !important;
	position: initial;
	vertical-align: super;
}
.font-weight-bold {
	font-weight: bold !important;
}
@media (max-width: 750px) {
	.GN_wrap .h2 {
		font-size: 6.9vw !important;
	}
	.GN_wrap .h3 {
		font-size: 5vw !important;
	}
	.GN_wrap .h4 {
		font-size: 3.7vw !important;
	}
	.GN_wrap p {
		font-size: 3.7vw;
	}
	small {
		font-size: 2.6vw;
	}
}

.GN_wrap .btn-wrap a,
.GN_wrap .btn-wrap button,
.GN_wrap .btn-wrap form {
	position: relative;
	overflow: hidden;
	display: inline-block;
}

.GN_wrap .btn-wrap a,
.GN_wrap .btn-wrap button {
	display: inline-block;
	text-align: center;
	padding: 16px 30px;
	font-size: 28px;
	letter-spacing: 0.1em;
	color: #fff;
	background-color: #000d1f;
	border: 1px solid #fff;
	box-shadow: 0 0 10px #fff;
	border-radius: 0;
	transition: background-color 0.25s ease-out, color 0.25s ease-out,
		border-color 0.25s ease-out;
	cursor: pointer;
	width: fit-content;
}

.GN_wrap .btn-wrap a::before,
.GN_wrap .btn-wrap button::before {
	content: "";
	background: url(../images/shine_light.png) no-repeat;
	background-position: center;
	background-size: cover;
	position: absolute;
	width: 200%;
	height: 200%;
	margin-top: -20%;
	display: block;
	pointer-events: none;
	animation: btn-shine 4s ease 1s infinite;
}
@keyframes btn-shine {
  0% {
    transform: translateX(-150%);
  }
  70% {
    transform: translateX(120%);
  }
  100% {
    transform: translateX(120%);
  }
}
.GN_wrap .btn-wrap a:hover,
.GN_wrap .btn-wrap button:hover {
	transition: all 0.5s ease;
	transform: scale(0.9);
	background: #fff;
	border: 1px solid #000;
	color: #000;
}
.GN_wrap .adjust {
	position: absolute;
	z-index: 1;
	display: block;
	width: 100px;
	top: -135px;
}
@media (max-width: 750px) {
	.GN_wrap .adjust {
		top: 10px;
	}
	.GN_wrap .btn-wrap a,
	.GN_wrap .btn-wrap button {
		padding: 2vw 8vw;
		font-size: 3.5vw;
	}
}
@media (max-width: 320px) {
	.GN_wrap .btn-wrap .REN-btn-buy,
	.GN_wrap .btn-wrap .REN-btn-try {
		padding: 7.5px 35px;
		font-size: 15px;
	}
}

.GN_wrap {
	max-width: 750px;
	width: 100%;
	margin: 0 auto;
	text-align: center;
	font-family: "Noto Sans TC", "Microsoft JhengHei", "微軟正黑體", serif;
	color: #fff;
}

.GN_wrap .note {
	position: absolute;
	margin: auto;
	left: 0; right: 0;
	bottom: 2em;
	padding: 0;
}

.GN_wrap .GN-content {
	position: absolute;
	z-index: 2;
	top: 0;	right: 0; left: 0;
	margin: auto;
	width: 100%;
	height: 100%;
}

.GN_wrap .sec-title {
	position: absolute;
	top: 30px; left: 0; right: 0;
	margin: 0 auto;
}
.GN_wrap .sec-title h2,
.GN_wrap .sec-title h3,
.GN_wrap .sec-title h4 {
	letter-spacing: 0.05em;
	width: fit-content;
	margin: 0 auto;
}
.GN_wrap .sec-title h2 span {
	font-size: 115%;
}
.GN_wrap .sec-title h4::before {
	content: "";
	display: block;
	width: 320px;
	height: 2px;
	background: linear-gradient(to right, rgba(255, 255, 255, 0), #fff, rgba(255, 255, 255, 0));
	margin: 8px auto;
}

@media (max-width: 750px) {
	.GN_wrap .sec-title {
		top: 4vw;
		left: 0;
		right: 0;
	}
}

/**********************section-1 KV**************************/
.GN_wrap .section-kv {
	width: 100%;
	position: relative;
	overflow: hidden;
}
.GN_wrap .section-kv .GN-content .GN-logo {
	width: 40%;
	margin-top: 100px;
}
.GN_wrap .section-kv h2 {
	position: relative;
	width: fit-content;
	margin: 62px auto 12px;
	font-size: 48px !important;
	letter-spacing: -.05em;
}
.GN_wrap .section-kv h2 span {
	font-size: 130%;
}
.GN_wrap .section-kv h3 {
	letter-spacing: .2em;
	font-size: 42px !important;
	margin-top: 4px;
}
.GN_wrap .section-kv h3 span {
	font-size: 138%;
}
.GN_wrap .section-kv .btn-wrap {
	width: fit-content;
	position: absolute;
	bottom: 11.8%; right: 0; left: 0;
	margin: 0 auto;
	z-index: 9;
}
.GN_wrap .section-kv .btn-wrap a {
	min-width: 240px;
	margin: 0 5px;
}
.GN_wrap .section-kv .note {
	position: absolute;
	bottom: 3%; left: 4%;
	text-align: left;
	width: 92%;
	margin: 0; padding: 0;
	color: #fff;
	font-size: 20px;
	line-height: 1.25;
}
.GN_wrap .section-kv .sp {
	position: absolute;
	top: 410px; left: 44px;
	text-align: left;
	text-shadow: 0px 0px 10px rgba(18, 23, 38, 0.7);
}
.GN_wrap .section-kv .sp li::after{
	content: "";
	width: 44px; height: 2px;
	display: block;
	background: #fff;
	margin: 25px auto 0;
}
.GN_wrap .section-kv .sp li:nth-of-type(3)::after {
	display: none;
}
.GN_wrap .section-kv .sp li:nth-of-type(3) .sp_p {
	align-self:last baseline;
	font-size: 22px;
	transform: translateY(-12px)
}
.GN_wrap .section-kv .sp_num {
	font-size: 72px;
	font-weight: 300;
	display: flex;
	justify-content: center;
	align-items: center;
}
.GN_wrap .section-kv .sp_sign {
	font-size: 40px;
}
.GN_wrap .section-kv .sp_p {
	font-size: 35px;
}
.GN_wrap .section-kv .sp_p sup {
	font-size: 12px !important;
	margin-top: 16px;
	transform: translateY(6px);
	display: inline-block;
}
.GN_wrap .section-kv .sp_txt {
	font-size: 22px;
	text-align: center;
	margin-top: -8px;
}
.GN_wrap .section-kv .kv-tt {
	color: #fff;
	position: absolute;
	right: 24px; top: 986px;
	text-align: right;
}
.GN_wrap .section-kv .kv-tt .tt1 {
	font-size: 26px;
	color: #000;
	width: fit-content;
	margin-left: auto;
	background: url("../images/tt1.png") no-repeat right center;
	background-size: 100%;
	padding: 4px 24px;
	margin-bottom: 2px;
}
.GN_wrap .section-kv .kv-tt .tt2 {
	margin-bottom: 8px;
	letter-spacing: 0;
}
.GN_wrap .section-kv .kv-tt .tt3 {
	font-size: 22px;
	letter-spacing: .03em;
	border: 1px solid #fff;
	width: fit-content;
	margin-left: auto;
	padding: 2px 28px;
}
@media (max-width: 750px) {
	.GN_wrap .section-kv .GN-content .GN-logo {
		margin-top: 13.3vw;
	}
	.GN_wrap .section-kv h2 {
		margin: 8.2vw auto 1.6vw;
		font-size: 6.4vw !important;
	}
	.GN_wrap .section-kv h3 {
		font-size: 5.6vw !important;
		margin-top: 0.5vw;
	}
	.GN_wrap .section-kv .btn-wrap a {
		min-width: 32vw;
		margin: 0 0.6vw;
	}
	.GN_wrap .section-kv .note {
		font-size: 2.6vw;
	}
	.GN_wrap .section-kv .sp {
		top: 54.6vw; left: 5.8vw;
	}
	.GN_wrap .section-kv .sp li::after {
		width: 5.8vw; height: 0.2vw;
		margin: 3.3vw auto 0;
	}
	.GN_wrap .section-kv .sp li:nth-of-type(3) .sp_p {
		font-size: 2.9vw;
		transform: translateY(-1.6vw);
	}
	.GN_wrap .section-kv .sp_num {
		font-size: 9.6vw;
	}
	.GN_wrap .section-kv .sp_sign {
		font-size: 5.3vw;
	}
	.GN_wrap .section-kv .sp_p {
		font-size: 4.6vw;
	}
	.GN_wrap .section-kv .sp_p sup {
		font-size: 1.6vw !important;
		margin-top: 2.1vw;
		transform: translateY(0.8vw);
	}
	.GN_wrap .section-kv .sp_txt {
		font-size: 2.9vw;
		margin-top: -1vw;
	}
	.GN_wrap .section-kv .kv-tt {
		right: 3.2vw; top: 131.4vw;
	}
	.GN_wrap .section-kv .kv-tt .tt1 {
		font-size: 3.4vw;
		padding: 0.5vw 3.2vw;
		margin-bottom: 0.2vw;
	}
	.GN_wrap .section-kv .kv-tt .tt2 {
		margin-bottom: 1vw;
	}
	.GN_wrap .section-kv .kv-tt .tt3 {
		font-size: 2.9vw;
		letter-spacing: .03em;
		border: 0.1333vw solid #fff;
		padding: 0.2vw 3.7vw;
	}
}

/**********************section-2-VIDEO**************************/
.GN_wrap .section-video-wrap {
	width: 100%;
	position: relative;
	text-align: center;
	overflow: hidden;
}
.GN_wrap .section-video-wrap .GN-content .bottom {
	width: 90%;
	position: relative;
	margin: 160px auto 0;
	text-align: center;
	border: 1px solid rgba(255, 255, 255, .5);
	box-shadow: 0 0 24px rgba(0, 0, 0, 0.5);
}
.GN_wrap .section-video-wrap .GN-content .bottom img {
  	width: 100%;
}
.GN_wrap .section-video-wrap .GN-content .bottom a {
	width: 11%;
	position: absolute;
	top: 40%; left: 0; right: 0;
	margin: 0 auto;
	display: block;
	z-index: 1;
}
.GN_wrap .section-video-wrap .GN-content .bottom a img {
	width: 100%;
	display: block;
	filter: drop-shadow(10px 10px 30px rgba(255, 255, 255, 1));
	transition: 0.2s;
	animation: circle-jump 0.5s linear infinite alternate;
}
.GN_wrap .section-video-wrap .nav-item {
	position: absolute;
	width: 100%;
	padding: 40px 0 0;
	font-size: 26px;
	z-index: 10;
}
.GN_wrap .section-video-wrap .nav-item span {
  	font-size: 14px;
	color: #002b63;
	display: inline-block;
	transform: translateY(-6px);
}
.GN_wrap .section-video-wrap .nav-item a {
	padding: 1% 2%;
	display: inline-block;
	color: #002b63;
}
.GN_wrap .section-video-wrap .nav-item a:hover {
  	color: #fff;
}
@keyframes circle-jump {
	0% {
		transform: scale(0.85);
	}
	100% {
		transform: scale(1);
	}
}
.GN_wrap .section-video-wrap .GN-content .video_play {
  	cursor: pointer;
}
.GN_wrap .section-video-wrap .GN-content .video_play video {
	width: 100%;
	height: auto;
}
@media screen and (max-width: 750px) {
	.GN_wrap .section-video-wrap .GN-content .bottom {
		margin: 21.3vw auto 0;
		box-shadow: 0 0 3.2vw rgba(0, 0, 0, 0.5);
	}
	.GN_wrap .section-video-wrap .nav-item {
		padding: 5.3vw 0 0;
		font-size: 3.4vw;
	}
	.GN_wrap .section-video-wrap .nav-item span {
		font-size: 1.8vw;
		transform: translateY(-0.8vw);
	}
}



/* section 3 */
.section-3 .sec-title h2 {
	width: 100%;
}
.section-3 .sec-title h2::after {
	content: "";
	display: block;
	position: absolute;
	top: 0; left: 0;  right: 0;
	width: 100%; height: 195px;
	background: url("../images/sec_03_tt2.png") no-repeat top center;
	background-size: 100%;
	z-index: 0;
	pointer-events: none;
}
.section-3 .sec-title h3 {
	margin-top: 16px;
}
.sec3-ball, .sec3-skin {
	pointer-events: none;
	z-index: 5;
}
.sec3-ball {
  	transition: transform 3s ease-in-out;
	z-index: 1;
	transform: translateY(0);
}
.sec3-ball.move-down {
	animation: ballDrop 2s linear forwards;
}
@keyframes ballDrop {
	0% {
		transform: translateY(0);
		opacity: 1;
	}
	70% {
		transform: translateY(200px);
		opacity: 1;
	}
	100% {
		transform: translateY(280px);
		opacity: 0;
	}
}
.sec3-skin {
  	z-index: 2;
}
.sec3-ingredient {
	z-index: 3;
	width: 100%; height: 55.9%;
}
.sec3-ingredient .ing {
	text-align: left;
	filter: 
		drop-shadow(0 0 8px rgba(0, 27, 61, 0.8))
		drop-shadow(0 0 12px rgba(0, 27, 61, 0.6))
		drop-shadow(0 0 16px rgba(0, 27, 61, 0.4));
  	animation: glowPulse 2s ease-in-out infinite;
}
/* 呼吸閃動動畫 */
@keyframes glowPulse {
  0%, 100% {
    filter: 
      drop-shadow(0 0 8px rgba(0, 27, 61, 0.8))
      drop-shadow(0 0 12px rgba(0, 27, 61, 0.6))
      drop-shadow(0 0 16px rgba(0, 27, 61, 0.4));
  }
  50% {
    filter: 
      drop-shadow(0 0 12px rgba(0, 27, 61, 1))
      drop-shadow(0 0 18px rgba(0, 27, 61, 0.8))
      drop-shadow(0 0 24px rgba(0, 27, 61, 0.6));
  }
}
.sec3-ingredient .ing-tt {
	margin-bottom: 22px;
	width: fit-content;
}
.sec3-ingredient .ing-tt::after {
	content: "";
	display: inline-block;
	width: 50px; height: 50px;
	margin-left: 16px;
	margin-top: -8px;
	vertical-align: middle;
	background: url("../images/sec_03_plus.png") no-repeat center;
	background-size: 100%;
}
.sec3-ingredient .ing.active .ing-tt::after{
	background: url("../images/sec_03_minus.png") no-repeat center;
	background-size: 100%;
}
.sec3-ingredient p {
	line-height: 1.45;
	display: none;
}
.sec3-ingredient .ing1 {
	left: 6%; top: 38%;
}
.sec3-ingredient .ing2 {
	left: 62%; top: 38%;
}
.sec3-ingredient .ing3 {
	left: 9.5%; top: 73.7%;
}
.sec3-ingredient .ing4 {
	left: 65.5%; top: 73.7%;
}
.sec3-skin .skin-tt {
	font-size: 42px;
	color: #fff;
	letter-spacing: .08em;
	text-align: left;
	text-shadow: 0 0 16px #d3f6ff;
}
.sec3-skin .tt1 {
	top: 63.8%; left: 10.5%;
}
.sec3-skin .tt2 {
	top: 81.5%; left: 10.5%;
}
.sec3-skin .skin-bubble {
	width: 160px; height: 160px;
	line-height: 160px;
	text-align: center;
	background: url("../images/sec_03_bubble.png") no-repeat center;
	background-size: 100%;
	font-size: 32px;
}
.sec3-skin .bubble1 {
	top: 57.5%; right: 2.8%;
}
.sec3-skin .bubble2 {
	top: 66.5%; right: 17.5%;
}
.sec3-skin .bubble3 {
	top: 75.3%; right: 2.8%;
}
.sec3-skin .bubble4 {
	top: 84.2%; right: 17.5%;
}
@media screen and (max-width: 750px) {
	.section-3 .sec-title h2::after {
		width: 100%; height: 26vw;
	}
	.section-3 .sec-title h3 {
		margin-top: 2.1vw;
	}
	.sec3-ingredient .ing-tt {
		margin-bottom: 2.9vw;
	}
	.sec3-ingredient .ing-tt::after {
		width: 6.6vw; height: 6.6vw;
		margin-left: 2.1vw;
		margin-top: -1vw;
	}
	.sec3-skin .skin-tt {
		font-size: 5.6vw;
	}
	.sec3-skin .skin-bubble {
		width: 21.3vw; height: 21.3vw;
		line-height: 21.3vw;
		font-size: 4.2vw;
	}
}



/* section 4 */
.section-4 .ba1 {
	top: 0.3%;
}
.section-4 .ba2 {
	top: 50%;
}
.sec4-ba .ba-tt {
	font-size: 40px;
	letter-spacing: .1em;
}
.sec4-ba .sp_num {
	font-size: 80px;
	display: flex;
	align-items: center;
}
.sec4-ba .sp_sign {
	font-size: 48px;
}
.sec4-ba .sp_p {
	font-size: 40px;
	align-self: flex-end;
	margin-bottom: 12px;
}
.ba1 .ba-tt {
	top: 24.5%; left: 14.7%;
}
.ba1 .sp_num {
	top: 41.5%; left: 8.2%;
}
.ba1 p {
	top: 77%; left: 4%;
}
.ba2 .ba-tt {
	top: 19%; left: 18%;
}
.ba2 .sp_num {
	top: 35.5%; left: 8.2%;
}
.ba2 p {
	top: 70.5%; left: 4%;
}
@media screen and (max-width: 750px) {
	.sec4-ba .ba-tt {
		font-size: 5.3vw;
	}
	.sec4-ba .sp_num {
		font-size: 10.6vw;
	}
	.sec4-ba .sp_sign {
		font-size: 6.4vw;
	}
	.sec4-ba .sp_p {
		font-size: 5.3vw;
		margin-bottom: 1.6vw;
	}
}



/* section 5 */
.section-5 .sec-title {
	top: 56px;
}
.section-5 .sec-title h2 {
	margin-bottom: 16px;
}
.section-5 .btn-wrap {
	width: fit-content;
	position: absolute;
	bottom: 4.5%; right: 0; left: 0;
	margin: 0 auto;
	z-index: 9;
}
.section-5 .btn-wrap a {
	min-width: 240px;
}
@media screen and (max-width: 750px) {
	.section-5 .sec-title {
		top: 7.4vw;
	}
	.section-5 .sec-title h2 {
		margin-bottom: 2.1vw;
	}
	.section-5 .btn-wrap a {
		min-width: 32vw;
	}
}



/* section 6 */
.section-6-qa {
  background: url("../images/sec_06.jpg") no-repeat top center;
  background-size: 100% 100%;
  padding: 56px 0;
  height: auto;
}
.section-6-qa .GN-content,
.section-6-qa .GN-content .sec-title {
  position: relative;
  top: 0;
  height: auto;
}
.section-6-qa h2 {
	margin-bottom: 28px !important;
}
.section-6-qa .qa-box {
	width: 86%;
	margin: 80px auto 0;
}
.section-6-qa .qa-box ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
.section-6-qa .qa-box ul li {
	width: 100%;
	align-items: flex-start;
	border: 1px solid rgba(192, 230, 251, .9);
	border-radius: 0 15px 0 15px;
	overflow: hidden;
	margin-bottom: 40px;
}
.section-6-qa .qa-title {
	padding: 28px 0 28px 80px;
	letter-spacing: 0;
	position: relative;
	background: url("../images/qa_plus.png") no-repeat right 24px center, linear-gradient( -15deg, rgb(22,56,99) 0%, rgb(4,18,30) 100%);
	text-align: left;
	margin-bottom: 0 !important;
}
.section-6-qa p {
  	padding: 40px;
	font-size: 28px;
	line-height: 1.7;
}
.section-6-qa .qa-title::before {
	content: "Q";
	position: absolute;
	left: 20px; top: 28px;
	width: 50px; height: 50px;
	line-height: 50px;
	font-size: 48px;
	text-align: center;
	color: #c0e6fb;
}
.section-6-qa .qa-box span,
.section-6-qa b {
	color: #c0e6fb;
	font-weight: bold;
}
.qa-box p {
	display: none;
	margin-top: 8px;
}
.qa-box li.active .qa-title {
	background: url("../images/qa_minus.png") no-repeat right 24px center, linear-gradient( -15deg, rgb(22,56,99) 0%, rgb(4,18,30) 100%);
}
@media screen and (max-width: 750px) {
  .section-6-qa {
    padding: 7.4vw 0;
  }
  .section-6-qa h2 {
    margin-bottom: 3.7vw !important;
  }
  .section-6-qa .qa-box {
    margin: 10.6vw auto 0;
  }
  .section-6-qa .qa-box ul li {
    border-radius: 0 2vw 0 2vw;
    margin-bottom: 5.3vw;
  }
  .section-6-qa .qa-title {
    padding: 3.7vw 0 3.7vw 10.6vw;
    background: url("../images/qa_plus.png") no-repeat right 3.2vw center, linear-gradient(-15deg, rgb(22,56,99) 0%, rgb(4,18,30) 100%);
  }
  .section-6-qa p {
    padding: 5.3vw;
    font-size: 3.7vw;
  }
  .section-6-qa .qa-title::before {
    left: 2.6vw; top: 3.7vw;
    width: 6.6vw; height: 6.6vw;
    line-height: 6.6vw;
    font-size: 6.4vw;
  }
  .qa-box p {
    margin-top: 1vw;
  }
  .qa-box li.active .qa-title {
    background: url("../images/qa_minus.png") no-repeat right 3.2vw center, linear-gradient(-15deg, rgb(22,56,99) 0%, rgb(4,18,30) 100%);
  }
}



/* section 7 */
.section-7 .sec-title {
	top: 48px;
}
.section-7 .sec-title img {
	margin-top: 20px;
	margin-bottom: 20px;
}
.section-7 .pd-wrap, .section-7 .btn-wrap {
	text-align: center;
	margin: 0 auto;
}
.section-7 .pd-name {
	letter-spacing: .025em;
	margin-bottom: 20px;
}
.section-7 .pd1 {
	top: 26.2%; left: 5.4%;
}
.section-7 .pd2 {
	top: 83%; left: 57%;
}
.section-7 .btn-wrap a,
.section-7 .btn-wrap button {
	background-image: linear-gradient(90deg, rgba(255,255,255,.64) 0%, rgba(255,255,255,0) 35%, rgba(255,255,255,0) 65%, rgba(255,255,255, .64) 100%);
	background-color: transparent;
	min-width: 240px;
}
@media screen and (max-width: 750px) {
	.section-7 .sec-title {
		top: 6.4vw;
	}
	.section-7 .sec-title img {
		margin-top: 2.6vw;
		margin-bottom: 2.6vw;
	}
	.section-7 .pd-name {
		margin-bottom: 2.6vw;
	}
	.section-7 .btn-wrap a,
	.section-7 .btn-wrap button {
		min-width: 32vw;
	}
}



/* section 8 */
.section-8 .sec-title {
	top: 48px;
}
.section-8 .sec-title h3 {
	width: 100%;
	margin-top: 46px;
	font-size: 45px !important;
	padding: 22px 0;
	background-image: linear-gradient(
		90deg, 
		rgba(26, 56, 102, 0) 0%, 
		rgba(26, 56, 102, 1) 30%, 
		rgba(26, 56, 102, 1) 70%, 
		rgba(26, 56, 102, 0) 100%);
}
.section-8 .sec-title h3 span {
	color: #bae4fb;
}
.section-8 .swiper {
	position: absolute !important;
	top: 0;
	width: 100%;
}
.section-8 .swiper-pagination {
	bottom: 64px !important;
}
.section-8 .swiper-pagination-bullet,
.section-8 .swiper-pagination-bullet-active {
	background: #fff !important;
}
.section-8 .swiper .btn-wrap {
	position: absolute;
}
.section-8 .btn-wrap a,
.section-8 .btn-wrap button {
	background-image: linear-gradient(90deg, rgba(255,255,255,.64) 0%, rgba(255,255,255,0) 35%, rgba(255,255,255,0) 65%, rgba(255,255,255, .64) 100%);
	background-color: transparent;
	min-width: 200px;
} 
.section-8 .btn1 {
	top: 84.8%; left: 16%
}
.section-8 .btn2 {
	top: 84.8%; left: 58%
}
.section-8 .btn3 {
	top: 63%; left: 68%;
}
.section-8 .btn4 {
	top: 76%; left: 68%;
}
@media screen and (max-width: 750px) {
	.section-8 .sec-title {
		top: 6.4vw;
	}
	.section-8 .sec-title h3 {
		margin-top: 6.1vw;
		font-size: 6vw !important;
		padding: 2.9vw 0;
	}
	.section-8 .swiper-pagination {
		bottom: 8.5vw !important;
	}
	.section-8 .btn-wrap a,
	.section-8 .btn-wrap button {
		min-width: 26.6vw;
	}
	.section-8 .btn1 {
		top: 84.8%; left: 12%
	}
	.section-8 .btn2 {
		top: 84.8%; left: 56%
	}
	.section-8 .btn3 {
		top: 63%; left: 65%;
	}
	.section-8 .btn4 {
		top: 76%; left: 65%;
	}
}



/**********************section bom **************************/
.section-promotion {
	background: url("../images/sec_09.jpg?$staticlink$") no-repeat top center;
	background-size: 100% 100%;
	padding: 48px 0;
}
.section-promotion .sec-title {
	top: 0;
	position: relative !important;
	margin-bottom: 48px;
}
.section-promotion .GN-content {
	position: relative !important;
	height: auto;
}
.section-promotion a {
	display: block;
	margin-bottom: 40px;
}
.section-promotion a:hover {
	transform: scale(0.95);
}
.section-promotion .btn-wrap {
	margin-top: 24px;
}
@media (max-width: 750px) {
	.section-promotion {
		padding: 6.4vw 0;
	}
	.section-promotion .sec-title {
		margin-bottom: 6.4vw;
	}
	.section-promotion a {
		margin-bottom: 5.3vw;
	}
	.section-promotion .btn-wrap {
		margin-top: 3.2vw;
	}
}