﻿
/************************************************************************************
RESET
*************************************************************************************/
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, font, 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 {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    /*vertical-align: baseline;*/
    background: transparent;
}
body {line-height: 1; -webkit-text-size-adjust: none;}
ol, ul { list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,q:before, q:after {content: ''; content: none;}
/* remember to define focus styles! */
:focus {outline: 0;}
/* remember to highlight inserts somehow! */
ins {text-decoration: none;}
del {text-decoration: line-through;}
/* tables still need 'cellspacing="0"' in the markup */
table {
   /* border-collapse: collapse;*/
    border-spacing: 0;
}
a img {border: none;}
img {max-width: 100%;image-rendering: -webkit-optimize-contrast;}
.clean { clear:both;}
a {color: #333333; text-decoration: none; blr:expression(this.onFocus=this.blur()); outline: none; /* for Firefox */hlbr:expression(this.onFocus=this.blur());}
a:hover {text-decoration:none;}
a:focus{ -moz-outline-style: none;}
.b-box{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

body {
	margin: 0;
	padding: 0;
	font-size:14px;
	overflow-x: hidden;
}

h1,h2,h3 { display: none;font-weight: inherit;}


/*wow*/
.wow:first-child {
	visibility: hidden;
	visibility:visible \9;
}

/*動畫*/
@keyframes floating-dot {
	0% {
		transform: translateY(-30%);
		opacity:1;
	}
	50% {
		transform: translateY(900%);	
		opacity:0;
	}	
	100% {
		transform: translateY(-30%);
		opacity:1;
	}			
}

@-webkit-keyframes floating-dot {
	0% {
		-webkit-transform: translateY(-30%);
		opacity:1;
	}
	50% {
		-webkit-transform: translateY(900%);
		opacity:0;
	}	
	100% {
		-webkit-transform: translateY(-30%);
		opacity:1;
	}			
}

/*基本顏色變數*/
:root {
	/*基本*/
	--white-color:#ffffff;
	--black-color:#333333;
	--family-normal:Verdana,'微軟正黑體';
}

#back-top {
	right: 2%;
    z-index: 3;
	left: inherit !important;
}


/*PC
-----------------------------------------------------------------*/


/*主框架*/
.container {
	width:100%;
	margin: auto;
	font-family: var(--family-normal);
}

.block-center  {
	width: 100%;
	max-width:1365px;
	margin: auto;
	clear: both;
	position: relative;
}

.block-top-menu {
	width: 100%;
	clear: both;
	max-width: 1850px;
	margin: 0 auto;
}

.top-menu {
	text-align: right;
	padding: 40px 0 0 0;
}

.top-menu li {
	display: inline-block;
	margin: 10px 20px 10px 0px;
}

.top-menu a {
	display: inline-block;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding: 10px 20px;
	border-radius: 20px;
	font-size: 20px;
	color: var(--black-color);
}


#japan .top-menu a:hover {
	background: rgb(255,236,225);
	background: linear-gradient(31deg, rgba(255,236,225,1) 0%, rgba(203,247,251,1) 100%);
}

#korea .top-menu a:hover {
	background: rgb(233,255,198);
	background: linear-gradient(31deg, rgba(233,255,198,1) 0%, rgba(166,220,255,1) 100%);
}

#china .top-menu a:hover {
	background: rgb(234,239,255);
	background: linear-gradient(31deg, rgba(234,239,255,1) 0%, rgba(227,255,236,1) 100%);
}

#sea .top-menu a:hover {
	background: rgb(255,234,251);
	background: linear-gradient(31deg, rgba(255,234,251,1) 0%, rgba(255,232,213,1) 100%);
}

#eu .top-menu a:hover {
	background: rgb(255,220,220);
	background: linear-gradient(31deg, rgba(255,220,220,1) 0%, rgba(171,236,255,1) 100%);
}

#tw .top-menu a:hover {
	background: rgb(220,255,195);
	background: linear-gradient(31deg, rgba(220,255,195,1) 0%, rgba(255,235,164,1) 100%);
}

.block-main {
	width: 95%;
	min-height: 745px;
	position: relative;
	border-radius: 50px 50px 50px 0;
	overflow: hidden;
	margin: 0 auto;
}

#japan .block-main {
	background: url(../images/main_bk_jp.jpg);
}

#korea .block-main {
	background: url(../images/main_bk_kr.jpg);
}

#china .block-main {
	background: url(../images/main_bk_cn.jpg);
}

#sea .block-main {
	background: url(../images/main_bk_sea.jpg);
}

#eu .block-main {
	background: url(../images/main_bk_eu.jpg);
	border-radius: 50px;
}

#tw .block-main {
	background: url(../images/main_bk_tw.jpg);
	border-radius: 50px;
}

.main-pic {
	display: inline-block;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	width: 100%;
	position: relative;
}

#japan .main-pic {
	text-align: right;
	padding: 235px 140px 0 0;
}

#korea .main-pic {
	text-align: left;
	padding:188px 0 0 130px;
}

#china .main-pic {
	text-align: right;
	padding:200px 150px 0 0;
}

#sea .main-pic {
	text-align: left;
	padding:217px 0 0 310px;
}

#eu .main-pic {
	text-align: right;
	padding:210px 265px 0 0;
}

#tw .main-pic {
	text-align: right;
	padding:215px 275px 0 0;
}

.main-view-line {
	width: 11px;
	max-width: 11px;
	position: absolute;
	bottom: 0px;
	right:115px;
	text-align: center;
	height: 150px;
	background:url(../images/main_slide_line_bk.png) center repeat-y;
}

.main-view-line span {
	width: 11px;
	height: 11px;
	background: var(--white-color);
	border-radius: 100px;
	display: inline-block;
}

.view-line-dot {
	animation-name: floating-dot;
    -webkit-animation-name: floating-dot;
    animation-duration: 3s;
    -webkit-animation-duration: 3s;
    animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
	width: 11px;
	height: 11px;
}

.main-pic img {
	display: inline-block;
}

.main-ipad ,.main-phone {
	display: none;
}

.menu-all {
	position: absolute;
	left:0px;
	bottom: 0px;
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 20px 20px 0 0;
	border-radius: 0 50px 0 0;
	background: var(--white-color);
    display: inline-block;
}

.block-menu {
	width: 100%;
	background:var(--white-color);
	text-align: left;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	display: flex;
	align-items: stretch;
    align-content: flex-end;
    flex-wrap: wrap;
	justify-content: flex-start;
}

.sticky.block-menu {
	left: 0px;
    top: 30px !important;
    width: 100%;
    background: var(--white-color);
    padding:10px 0 0px 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	max-width: unset;
	text-align: center;
    border-radius: 0;
	display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

.block-special {
	width: 100%;
	display: inline-block;
	padding: 100px 0 60px 0;
}

.menu-type {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding: 0 0 2px 0;
	text-align: left;
	margin: 0 10px 10px 0;
	display: inline-flex;
}

#japan .menu-type {
	border-bottom: 2px solid #c5ecec;
}

#korea .menu-type {
	border-bottom: 2px solid #c4e8ff;
}

#china .menu-type {
	border-bottom: 2px solid #d1f4d2;
}

#sea .menu-type {
	border-bottom: 2px solid #ffdaba;
}

.menu-type-title {
	display: inline-block;
}

ul.menu-link {
	display: inline-flex;
}

.menu-link li {
	display: inline-block;
}

.menu-link a {
	display: inline-block;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	border-radius: 20px 20px 0 0;
	text-align: center;
	color: var(--black-color);
	background: var(--white-color);
	margin: 0 10px 0 0;
	font-size: 20px;
	line-height: 22px;
	padding: 15px 25px 0 25px;
}

#china .menu-link a {
    margin: 0 5px 0 0;
    padding: 15px 10px 0 10px;
}


#japan .menu-link a:hover ,#japan .menu-active a {
	background: rgb(255,186,142);
	background: linear-gradient(180deg, rgb(255,186,142,1) 0%, rgba(255, 255, 255, 1) 100%);
}

#korea .menu-link a:hover ,#korea .menu-active a {
	background: rgb(181,235,94);
	background:linear-gradient(180deg, rgb(181,235,94,1) 0%, rgba(255, 255, 255, 1) 100%);
}

#china .menu-link a:hover ,#china .menu-active a {
	background: rgb(173,191,255);
	background: linear-gradient(180deg, rgb(173,191,255,1) 0%, rgba(255, 255, 255, 1) 100%);
}

#sea .menu-link a:hover ,#sea .menu-active a {
	background: rgb(255,171,241);
	background: linear-gradient(180deg, rgb(255,171,241,1) 0%, rgba(255, 255, 255, 1) 100%);
}

.block-special-space {
	width: 100%;
	padding: 60px 0;
}

#japan .block-special-space {
	background:url(../images/special_bk_jp.png) repeat-y center top;
}

#korea .block-special-space {
	background:url(../images/special_bk_kr.png) repeat-y center top;
}

#china .block-special-space {
	background:url(../images/special_bk_cn.png) repeat-y center top;
}

#sea .block-special-space {
	background:url(../images/special_bk_sea.png) repeat-y center top;
}

/*介紹型商品*/
.special-intro-space {
	width: 100%;
	clear: both;
}


.special-intro-title {
	width: 100%;
	text-align: left;
	color: var(--black-color);
	font-size: 45px;
	line-height: 50px;
	font-weight: bold;
	margin: 0 0 20px 0;
	position: relative;
	z-index: 1;
	display: inline-block;
}

.special-intro-title::before {
	content: '';
	width: 150px;
	height: 150px;
	border-radius: 100%;
	position: absolute;
	left: -60px;
    top: -50px;
    z-index: -1;
}

#japan .special-intro-title::before {
	background: rgb(255,236,225);
	background: linear-gradient(42deg, rgba(255,236,225,1) 0%, rgba(203,247,251,1) 100%);
}

#korea .special-intro-title::before {
	background: rgb(242,255,222);
	background: linear-gradient(42deg, rgba(242,255,222,1) 0%, rgba(203,235,255,1) 100%);
}

#china .special-intro-title::before {
	background: rgb(234,239,255);
	background: linear-gradient(42deg, rgba(234,239,255,1) 0%, rgba(227,255,236,1) 100%);
}

#sea .special-intro-title::before {
	background: rgb(255,234,251);
	background: linear-gradient(42deg, rgba(255,234,251,1) 0%, rgba(255,232,213,1) 100%);
}

.special-intro-text {
	width: 100%;
	text-align: left;
	color: var(--black-color);
	font-size: 20px;
	line-height:35px;
	margin: 0 0 45px 0;
	z-index: 1;
    position: relative;
}

.special-video-full {
	width:100%;
	text-align: center;
}

.special-video-full iframe {
	width: 100%;
	height: 700px;
	border-radius: 50px;
	overflow: hidden;
}

.special-three-product-space {
	width: 100%;
	clear: both;
	text-align: center;
	display: flex;
	justify-content: center;
    align-items: flex-start;
	flex-wrap: wrap;
}

a.special-three-product-box {
	display:flex;
	width: 32%;
	margin: 20px 5px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	border-radius: 50px;
	overflow: hidden;
	position: relative;
	flex-wrap: wrap;
    align-items: flex-end;
}

a.special-three-product-box:hover {
	-webkit-transform: translateY(-2%);
    -moz-transform: translateY(-2%);
    -ms-transform: translateY(-2%);
    transform: translateY(-2%);
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    transition: all 0.2s;
}

#japan a.special-three-product-box {
	background: #c5ecec;
}

#korea a.special-three-product-box {
	background: #a6dcff;
}

#china a.special-three-product-box {
	background: #d1f4d2;
}

#sea a.special-three-product-box {
	background: #ffdaba;
}

#japan a.special-three-product-box.special-hotel-three-product {
	background: #ffddc9;
}

#korea a.special-three-product-box.special-hotel-three-product {
	background: #e9ffc6;
}

#china a.special-three-product-box.special-hotel-three-product {
	background: #d7e1ff;
}

#sea a.special-three-product-box.special-hotel-three-product {
	background: #ffdcf9;
}



#japan a.special-three-product-box:hover {
	background: rgb(255,236,225);
	background: linear-gradient(54deg, rgba(255,236,225,1) 0%, rgba(203,247,251,1) 100%);
}

#korea a.special-three-product-box:hover {
	background: rgb(233,255,198);
background: linear-gradient(54deg, rgba(233,255,198,1) 0%, rgba(166,220,255,1) 100%);
}

#china a.special-three-product-box:hover {
	background: rgb(215,225,255);
	background: linear-gradient(54deg, rgba(215,225,255,1) 0%, rgba(209,244,210,1) 100%);
}

#sea a.special-three-product-box:hover {
	background: rgb(255,220,249);
	background: linear-gradient(54deg, rgba(255,220,249,1) 0%, rgba(255,218,186,1) 100%);
}

#japan a.special-three-product-box.special-hotel-three-product:hover {
	background: rgb(255,236,225);
	background: linear-gradient(225deg, rgba(255,236,225,1) 0%, rgba(203,247,251,1) 100%);
}

#korea a.special-three-product-box.special-hotel-three-product:hover {
	background: rgb(233,255,198);
background: linear-gradient(225deg, rgba(233,255,198,1) 0%, rgba(166,220,255,1) 100%);
}

#china a.special-three-product-box.special-hotel-three-product:hover {
	background: rgb(215,225,255);
	background: linear-gradient(225deg, rgba(215,225,255,1) 0%, rgba(209,244,210,1) 100%);
}

#sea a.special-three-product-box.special-hotel-three-product:hover {
	background: rgb(255,220,249);
	background: linear-gradient(225deg, rgba(255,220,249,1) 0%, rgba(255,218,186,1) 100%);
}

.special-three-product-name {
	width: 100%;
	text-align: center;
	font-size: 30px;
	font-weight: bold;
	line-height: 35px;
	padding: 48px 5px 32px 5px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.special-three-product-buy {
	margin: 40px 0 0 0;
	text-align: left;
	width: 100%;
	background: url(../images/special_product_bk.png) right center no-repeat;
}

.special-three-product-buy span {
	display: inline-block;
	background: var(--white-color);
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding: 20px 95px 15px 20px;
	border-radius: 0 50px 0 0;
	color: var(--black-color);
	font-size: 28px;
	position: relative;
}

.special-three-product-buy span::after {
	content: '';
	position: absolute;
	right: 43px;
	top: 18px;
	width: 35px;
	height: 35px;
	border-radius: 100px;
}

#japan .special-three-product-buy span::after {
	background: url(../images/special_white_arr.png) no-repeat center #c5ecec;
}

#japan a.special-three-product-box:hover .special-three-product-buy span::after {
	background: url(../images/special_white_arr.png) no-repeat center #ffddc9;
}

#korea .special-three-product-buy span::after {
	background: url(../images/special_white_arr.png) no-repeat center #a6dcff;
}

#korea a.special-three-product-box:hover .special-three-product-buy span::after {
	background: url(../images/special_white_arr.png) no-repeat center #e9ffc6;
}

#china .special-three-product-buy span::after {
	background: url(../images/special_white_arr.png) no-repeat center #d1f4d2;
}

#china a.special-three-product-box:hover .special-three-product-buy span::after {
	background: url(../images/special_white_arr.png) no-repeat center #d7e1ff;
}

#sea .special-three-product-buy span::after {
	background: url(../images/special_white_arr.png) no-repeat center #ffdaba;
}

#sea a.special-three-product-box:hover .special-three-product-buy span::after {
	background: url(../images/special_white_arr.png) no-repeat center #ffdcf9;
}

#japan .special-hotel-three-product .special-three-product-buy span::after {
	background: url(../images/special_white_arr.png) no-repeat center #ffddc9;
}

#japan a.special-hotel-three-product.special-three-product-box:hover .special-three-product-buy span::after {
	background: url(../images/special_white_arr.png) no-repeat center #c5ecec;
}

#korea .special-hotel-three-product .special-three-product-buy span::after {
	background: url(../images/special_white_arr.png) no-repeat center #e9ffc6;
}

#korea a.special-hotel-three-product.special-three-product-box:hover .special-three-product-buy span::after {
	background: url(../images/special_white_arr.png) no-repeat center #a6dcff;
}

#china .special-hotel-three-product .special-three-product-buy span::after {
	background: url(../images/special_white_arr.png) no-repeat center #d7e1ff;
}

#china a.special-hotel-three-product.special-three-product-box:hover .special-three-product-buy span::after {
	background: url(../images/special_white_arr.png) no-repeat center #d1f4d2;
}

#sea .special-hotel-three-product .special-three-product-buy span::after {
	background: url(../images/special_white_arr.png) no-repeat center #ffdcf9;
}

#sea a.special-hotel-three-product.special-three-product-box:hover .special-three-product-buy span::after {
	background: url(../images/special_white_arr.png) no-repeat center #ffdaba;
}

.special-more {
	width: 100%;
	clear: both;
	text-align: center;
	margin: 40px auto 20px auto;
}

.special-more h3 {
	display: inline;
}

.special-more a {
	display: inline-block;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	font-size: 20px;
	padding: 10px 30px;
	min-width: 200px;
	text-align: center;
	color: var(--black-color);
	line-height: 24px;
	border-radius: 100px;
	border:1px solid var(--black-color);
	background: var(--white-color);
	margin:5px;
}

.special-more a:hover {
	-webkit-transform: translateY(-5%);
    -moz-transform: translateY(-5%);
    -ms-transform: translateY(-5%);
    transform: translateY(-5%);
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    transition: all 0.2s;
}

.special-intro-flex {
	display: flex;
}

.special-intro-half-box {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	display: inline-block;
	width: 50%;
}

.special-intro-half-box:first-child {
	padding: 0 50px 0 0;
}

.special-intro-half-box:last-child {
	padding:0 0 0 50px;
}

.special-intro-half-iframe {
	width: 100%;
}

.special-intro-half-iframe iframe {
	width: 100%;
	height: 855px;
	display: inline-block;
	border-radius: 50px;
}

.special-intro-half-iframe span {
	width: 100%;
	text-align: right;
	padding: 10px 20px;
	display: inline-block;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	color: var(--black-color);
	font-size: 20px;
	line-height: 24px;
}

.special-intro-half-pic {
	position: relative;
}

.special-intro-half-pic img {
	display: inline-block;
	border-radius: 50px;
}

.special-intro-half-pic span {
	text-shadow: 0 0 5px var(--black-color);
	text-align: right;
	padding: 10px 20px;
	display: inline-block;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
    color: var(--white-color);
    font-size: 15px;
    line-height: 18px;
    position: absolute;
    right: 5%;
    bottom: 3%;
    background:rgb(51 51 51 / 50%);
    border-radius: 50px;
}

.special-intro-half-box .special-intro-space {
    padding: 40px 0 0 0;
}

.special-intro-circle-space {
	width: 100%;
	margin: 40px auto;
	position: relative;
	min-height: 430px;
}

.intro-circle-float {
	position: absolute;
	width: 100%;
}

.intro-circle-float span {
	width: 100%;
	display: inline-block;
	text-align: center;
	color: var(--black-color);
	font-size: 15px;
    line-height: 18px;
    margin: 5px 0 0 0;
}

.intro-circle-float img {
	border-radius: 500px;
}

.intro-circle1 {
	left: 0px;
	top: 0px;
	max-width: 255px;
}

.intro-circle2 {
	right: 0px;
	top: 60px;
	max-width: 350px;
}

.intro-circle3 {
	left: 0px;
	top: 150px;
	max-width: 255px;
}

.intro-circle4 {
	right: 0px;
	top: 0px;
	max-width: 350px;
}

.special-intro-buy-space {
	width: 100%;
	text-align: center;
}

.special-intro-buy-space a {
	display: inline-block;
	border-radius: 100px;
	text-align: left;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding: 15px 80px 15px 40px;
	color: var(--white-color);
	font-size: 25px;
	line-height: 28px;
	position: relative;
	margin: 5px;
}

.special-intro-buy-space h3 {
	display: inline;
}

.product-main-space .special-intro-buy-space a {
	display: inline-block;
	border-radius: 100px;
	text-align: center;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding: 10px 20px;
	color: var(--white-color);
	font-size: 20px;
	line-height: 24px;
	position: relative;
	margin: 5px;
}

.product-main-space .special-intro-buy-space a::after {
	display: none;
}

.special-intro-buy-space a:hover {
	-webkit-transform: translateY(-5%);
    -moz-transform: translateY(-5%);
    -ms-transform: translateY(-5%);
    transform: translateY(-5%);
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    transition: all 0.2s;
}

#japan .special-intro-buy-space a {
	background:#0e7878;
}

#korea .special-intro-buy-space a {
	background:#4593c4;
}

#china .special-intro-buy-space a {
	background:#2aa65e;
}

#sea .special-intro-buy-space a {
	background:#ee862a;
}

#eu .special-intro-buy-space a {
	background:#0078dc;
}

#tw .special-intro-buy-space a {
	background:#cf703d;
}

#japan .special-intro-buy-space a:hover {
	background: rgb(69,176,176);
	background: linear-gradient(62deg, rgba(69,176,176,1) 0%, rgba(24,152,152,1) 100%);
}

#korea .special-intro-buy-space a:hover {
	background: rgb(115,186,232);
	background: linear-gradient(62deg, rgba(115,186,232,1) 0%, rgba(69,147,196,1) 100%);
}

#china .special-intro-buy-space a:hover {
	background: rgb(42,166,94);
	background: linear-gradient(62deg, rgba(42,166,94,1) 0%, rgb(28, 148, 78,1) 100%);
}

#sea .special-intro-buy-space a:hover {
	background: rgb(238,134,42);
	background: linear-gradient(62deg, rgba(238,134,42,1) 0%, rgba(221,104,0,1) 100%);
}

#eu .special-intro-buy-space a:hover {
	background: rgb(0,120,220);
	background: linear-gradient(62deg, rgba(0,120,220,1) 0%, rgb(0, 80, 184,1) 100%);
}

#tw .special-intro-buy-space a:hover {
	background: rgb(207,112,61);
	background: linear-gradient(62deg, rgba(207,112,61,1) 0%, rgb(190, 92, 38) 100%);
}

.special-intro-buy-space a::after {
	position: absolute;
	content: '';
	right: 10px;
	top: 10px;
	width: 36px;
	height: 36px;
	border-radius: 100px;
}

#japan .special-intro-buy-space a::after {
	background: url(../images/special_arr_jp.png) center no-repeat var(--white-color);
}

#korea .special-intro-buy-space a::after {
	background: url(../images/special_arr_kr.png) center no-repeat var(--white-color);
}

#china .special-intro-buy-space a::after {
	background: url(../images/special_arr_cn.png) center no-repeat var(--white-color);
}

#sea .special-intro-buy-space a::after {
	background: url(../images/special_arr_sea.png) center no-repeat var(--white-color);
}

/*一般商品區*/
.block-product {
	padding: 60px 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

#japan .block-product {
	background: url(../images/product_bk.png) repeat-y center bottom #ffe5d6;
}

#korea .block-product {
	background: url(../images/product_bk.png) repeat-y center bottom #daf0c9;
}

#china .block-product {
	background: url(../images/product_bk.png) repeat-y center bottom #d7e1ff;
}

#sea .block-product {
	background: url(../images/product_bk.png) repeat-y center bottom #ffe9fb;
}

#eu .block-product {
	background:url(../images/special_bk_eu.png) repeat-y center top;
}

#tw .block-product {
	background:url(../images/special_bk_tw.png) repeat-y center top;
}

.product-area-space {
	width: 100%;
	padding:140px 0 20px 0;
	display: inline-block;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.product-area-title {
	width: 100%;
	margin: 0 0 20px 0;
	text-align: center;
	padding: 10px 0 0 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.product-area-title h2 {
	display: inline;
}

.product-area-title span {
	display: inline-block;
	color: var(--black-color);
	font-size: 45px;
	font-weight: bold;
	text-align: center;
	position: relative;
	z-index: 1;
}

.product-area-title span::before {
	content: '';
	position: absolute;
	width: 65px;
	height: 65px;
	background: rgb(255,255,255);
	background: linear-gradient(0deg, rgba(255,255,255,0.25) 0%, rgba(255,255,255,1) 100%);
	z-index: -1;
	border-radius: 100%;
    left: -25px;
    top: -25px;
}

#eu .product-area-title span::before {
	background: rgb(255,235,235);
	background: linear-gradient(31deg, rgba(255,235,235,1) 0%, rgba(212,245,255,1) 100%);
}

#tw .product-area-title span::before {
	background: rgb(237,255,224);
	background: linear-gradient(31deg, rgba(237,255,224,1) 0%, rgba(255,247,218,1) 100%);
}

.product-main-space {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.product-main-box {
	width: 31%;
	display: inline-block;
	margin: 10px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	border-radius: 50px;
	background: var(--white-color);
	overflow: hidden;
}

#eu .product-main-box {
	background: #def2ff;
}

#tw .product-main-box {
	background: #ffece1;
}

.product-main-box:hover {
	-webkit-transform: translateY(-2%);
    -moz-transform: translateY(-2%);
    -ms-transform: translateY(-2%);
    transform: translateY(-2%);
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    transition: all 0.2s;
}

.product-main-box:hover .product-main-pic {
	opacity: .8;
}

.product-main-pic {
	width: 100%;
	line-height: 0;
}

.product-main-intro {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding: 20px;
	text-align: left;
}

.product-main-name {
	width: 100%;
	color: var(--black-color);
	font-size: 25px;
	line-height: 28px;
	margin: 0 0 15px 0;
	font-weight: bold;
}

.product-main-name span {
	width: 100%;
	display: inline-block;
	text-align: center;
}

ul.product-main-list {
	width: 100%;
	margin: 0 0 20px 0;
}

.product-main-list li {
	color: var(--black-color);
	font-size: 15px;
	line-height: 22px;
	margin: 0 0 10px 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding:0 0 0 25px;
	position: relative;
}

.product-main-list li::after {
	position: absolute;
	content: '';
	width: 15px;
	height: 15px;
	border-radius: 100%;
	left: 0px;
	top: 4px;
}

#japan .product-main-list li::after {
	background: rgb(145,228,228);
	background: linear-gradient(63deg, rgba(145,228,228,1) 0%, rgba(213,246,246,1) 100%);
}

#korea .product-main-list li::after {
	background: rgb(166,220,255);
	background: linear-gradient(63deg, rgba(166,220,255,1) 0%, rgba(225,243,255,1) 100%);
}

#korea .product-main-list li::after {
	background: rgb(209,244,210);
	background: linear-gradient(63deg, rgba(209,244,210,1) 0%, rgb(245, 255, 245) 100%);
}

#sea .product-main-list li::after {
	background: rgb(255,218,186);
	background: linear-gradient(63deg, rgba(255,218,186,1) 0%, rgba(255,249,245,1) 100%);
}

#eu .product-main-list li::after {
	background: rgb(255 255 255);
    background: linear-gradient(63deg, rgb(255 255 255) 0%, rgb(241 252 255 / 16%) 100%);
}

#tw .product-main-list li::after {
	background: rgb(255 255 255);
    background: linear-gradient(63deg, rgb(255 255 255) 0%, rgba(223, 220, 70, 0.16) 100%);
}

.product-all {
	width: 100%;
	max-width:1365px;
	margin: 0 auto;
} 




/*中間調度區
-----------------------------------------------------------------*/
@media screen and (max-width: 1850px) {
	html,
    body {
        width: 100%;
        min-height: 100%;
	}

	.block-center {
		width: 95%;
	}

	.block-main {
		width: 95%;
		max-width:none;
		line-height: 0px;
		text-align: center;
		background: transparent !important;
		min-height: unset;
	}

	.menu-link a {
		padding: 15px 15px 0 15px;
	}

	.main-pic ,.main-view-line {
		display: none;
	}

	.main-ipad {
		display: inline-block;
		text-align: center;
		border-radius: 50px;
		overflow: hidden;
	}

	.menu-all {
		position: relative;
		text-align: center;
		width: 100%;
		padding: 10px 0 0 0;
	}

	.block-menu {
		display: inline-flex;
		justify-content: center;
	}

}

@media screen and (max-width: 1400px) {
	.special-intro-circle-space {
		display: flex;
		min-height: unset;
		justify-content: space-around;
	}

	.intro-circle-float {
		position: unset;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		padding: 10px;
	}

	.special-intro-half-iframe iframe {
		height: 550px;
	}

	.block-special {
		padding: 40px 0 20px 0;
	}

}

@media screen and (max-width: 900px) {
	.special-video-full iframe {
		height: 500px;
	}

	.menu-link a {
		padding: 15px 5px 0 5px;
		font-size: 18px;
	}

	a.special-three-product-box {
		width: 48%;
	}

	.special-intro-flex {
		flex-wrap: wrap;
	}

	.special-intro-half-pic {
		display: none;
	}

	.special-intro-half-box {
		width: 100%;
	}

	.special-intro-half-iframe {
		display: none;
	}

	.special-intro-half-box:first-child ,.special-intro-half-box:last-child {
		padding: 10px;
	}

	.special-intro-circle-space {
		margin: 0 auto 20px auto;
	}

	.product-main-box {
		width: 46%;
	}
	
	.product-main-space {
		justify-content: space-between;
	}

	.product-area-space {
		padding: 40px 0;
	}
	
}

/*平板
-----------------------------------------------------------------*/

@media screen and (max-width: 768px) {
	.block-top-menu {
		display: none;
	}

	.block-main {
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		padding: 20px 0 0 0;
	}

	.block-menu {
		display: none !important;
	}

	.special-video-full iframe {
		height: 400px;
	}

	.block-special-space {
		padding: 0;
	}

	.block-special {
		padding: 50px 0;
	}

	
}


/*中間調度區
-----------------------------------------------------------------*/

@media screen and (max-width:560px) {
	.main-ipad {
		display: none;
	}

	.main-phone {
		display: inline-block;
		text-align: center;
		border-radius: 50px;
		overflow: hidden;
	}

	.main-phone h1 {
		display: inline-block;
	}

	a.special-three-product-box {
		width: 100%;
	}

	.product-main-box {
		width: 100%;
		margin: 5px 20px;
	}

}

/*手機
-----------------------------------------------------------------*/

@media (max-width: 480px) {
	a.special-three-product-box {
		margin: 10px 5px;
	}
	
	
}

@media (max-width: 320px) {
}