@charset "UTF-8";
/*--------------------------------------------*/
@keyframes floatY {
				0% {
								transform: translateY(0);
				}
				100% {
								transform: translateY(10px);
				}
}
@keyframes floatX {
				0% {
								transform: translateX(-3px);
				}
				100% {
								transform: translateX(3px);
				}
}
@keyframes scaleX {
				0% {
								opacity: 0.8;
								transform: scaleX(0.9);
				}
				100% {
								opacity: 0.4;
								transform: scaleX(1.05);
				}
}
@keyframes space_floatX {
				0% {
								transform: scale(1);
								background-position-x: 100%;
								opacity: 1;
				}
				33% {
								transform: scale(1.04);
				}
				50% {
								opacity: 0.8;
				}
				67% {
								transform: scale(1);
				}
				100% {
								transform: scale(1.06);
								background-position-x: 0%;
								opacity: 1;
				}
}
@keyframes fadeUp {
				0% {
								opacity: 0;
								transform: translateY(40%);
				}
				100% {
								opacity: 1;
								transform: translateY(0%);
				}
}
@keyframes scaleFade {
				0% {
								opacity: 0.8;
								transform: scale(1);
				}
				100% {
								opacity: 0;
								transform: scale(2);
				}
}
@keyframes floatShadow {
				0% {
								opacity: 0.8;
								transform: scale(1.2);
				}
				100% {
								opacity: 1;
								transform: scale(0.8);
				}
}
html {
				font-size: 16px;
}

body {
				font-family: "Roboto", "Noto Sans TC", "Microsoft Jhenghei", "微軟正黑", sans-serif;
}

a {
				color: inherit;
}
a:hover {
				text-decoration: none;
}

.area {
				max-width: 1280px;
				margin-left: auto;
				margin-right: auto;
}

.obj_box {
				line-height: 1.2;
}
.obj_box .obj_name {
				color: #6fc1c1;
				font-size: 1.25em;
}
.obj_box .obj_valu {
				color: #fff;
				font-size: 1.75em;
				font-weight: 900;
}
.obj_box .strong {
				color: #f7e3aa;
}

@media (max-width: 1280px) {
				.area {
								max-width: 1140px;
				}
}
@media (max-width: 1080px) {
				.area {
								max-width: 960px;
				}
}
@media (max-width: 768px) {
				.area {
								max-width: 90%;
				}
}
.all_bg {
				position: fixed;
				left: 0;
				top: 0;
				z-index: 1;
				width: 100%;
				height: 100vh;
}
.all_bg img {
				width: 100%;
}
.all_bg .kv_bg {
				width: 100%;
				height: 100vh;
				background: url("../img/space.jpg") center/cover no-repeat;
}
.all_bg .kv_ship {
				position: absolute;
				top: 58%;
				left: 50%;
				width: 75%;
				transform: translate(-50%, -50%);
}

.all_wrap {
				position: relative;
				z-index: 2;
}

.g_kv .kv_tit {
				position: relative;
}
.g_kv .kv_tit .aos_wrap {
				padding-top: 13.6%;
}
.g_kv .kv_tit img {
				position: absolute;
				left: 0;
				top: 0;
				width: 100%;
}
.g_kv .kv_tit .layer2 {
				mix-blend-mode: overlay;
}
.g_kv .kv_tit .layer3,
.g_kv .kv_tit .layer4 {
				animation: floatX 3s linear infinite;
				animation-direction: alternate;
				opacity: 0.8;
}
.g_kv .kv_tit .layer4 {
				animation-direction: alternate-reverse;
}

.all_bg::after {
				content: "";
				position: absolute;
				left: 0;
				top: 0;
				right: 0;
				bottom: 0;
				background-color: rgba(0, 0, 0, 0.6);
}

.g_kv {
				margin: 5% auto;
				width: 66%;
}
.g_kv .kv_tit {
				position: relative;
				padding-top: 13.6%;
}

.g_main .title {
				font-size: 2.25em;
				font-weight: 700;
				color: #fff;
}
.g_main .left_block {
				margin-top: 1rem;
				margin-left: auto;
				margin-right: 30px;
				max-width: 480px;
				border: 1px solid #fff;
				color: #fff;
				padding: 4rem;
				background-color: rgba(0, 0, 0, 0.8);
				font-size: 1.5em;
				line-height: 1.6;
}
.g_main .left_block .c_white {
				color: #f7e3aa;
}
.g_main .left_block .link {
				font-size: 0.875em;
				color: #6fc1c1;
				text-decoration: underline;
}
.g_main .left_block .link:hover {
				color: #bbfffc;
}
.g_main .right_block {
				max-width: 480px;
}
.g_main .right_block .tip {
				position: relative;
				padding-left: 2em;
				color: #fff;
				font-size: 1.25em;
}
.g_main .right_block .tip::before {
				content: "";
				position: absolute;
				left: 10px;
				top: -0.25rem;
				border: 1px solid #fff;
				border-width: 0 0 1px 1px;
				width: 1.125em;
				height: 1em;
}
.g_main .right_block .tip a {
				color: #6fc1c1;
				text-decoration: underline;
}
.g_main .right_block .tip a:hover {
				color: #bbfffc;
}
.g_main .right_block .cp_form .item {
				margin-top: 1em;
				padding: 10px 20px;
				border-radius: 10px;
				border: 1px solid #fff;
				background-color: rgba(0, 0, 0, 0.5);
				width: 100%;
				text-align: left;
}
.g_main .right_block .cp_form .item .key {
				color: #f7e3aa;
}
.g_main .right_block .cp_form .item .input input {
				display: block;
				border: 0;
				outline-width: 0;
				padding: 0 0 6px;
				width: 100%;
				background-color: transparent;
				font-size: 1.5em;
				font-weight: 300;
				color: #fff;
}
.g_main .right_block .cp_form .item_tip {
				text-align: left;
				padding: 6px 20px;
				color: #fff;
}
.g_main .right_block .cp_form .cta {
				margin-top: 1.5rem;
}
.g_main .right_block .cp_form .cta .cta_btn {
				font-size: 2em;
}
.g_main .right_block .cp_form .cta .cta_btn {
				display: inline-block;
				border: none;
				border-radius: 0.4375rem;
				padding: 1rem 2.5rem;
				font-size: 1.5rem;
				line-height: 1em;
				cursor: pointer;
				transition: background 220ms;
}
.g_main .right_block .cp_form .cta .cta_btn.btn_positive {
				background-color: #3174d1;
				color: #fff;
}
.g_main .right_block .cp_form .cta .cta_btn.btn_positive:hover {
				background-color: #08408c;
}
.g_main .right_block .cp_form .cta .cta_btn.btn_negative {
				background-color: #e6e6e6;
				color: #808080;
}
.g_main .right_block .cp_form .cta .cta_btn.btn_negative:hover {
				background-color: #bababa;
}
.g_main .right_block .cta_btn {
				margin: 0 15px;
}

@media (max-width: 768px) {
				.g_kv {
								margin: 10% auto;
								width: 90%;
				}

				.g_main .left_block {
								border: 0;
								margin-right: 0;
								padding: 1em;
								font-size: 1.125em;
				}

				.g_main .right_block {
								padding-top: 2em;
								padding-bottom: 2em;
				}
}