@charset "utf-8";


.popupTemlate {display:block; position:relative; z-index:0; background:no-repeat 50% 50%; background-size:auto 100%; font-size:1em; overflow:hidden;}
.popupTemlate:before {content:""; display:block; position:relative; padding-top:75.51020408163265%; z-index:-1;}
.popupTemlate .frame {display:block; position:absolute; top:0; left:0; right:0; bottom:0; z-index:1; overflow:hidden;}
.popupTemlate .templ {display:table; width:100%; height:100%; z-index:1;}
.popupTemlate .templ > * {display:table-cell; vertical-align:middle; text-align:center; word-break:keep-all; font-size:1.2em; line-height:1.6; color:#222;}

.popupTemlate.theme-0 {background-image:url(/common/img/basic/promotion/pop_notemplate.jpg);}
.popupTemlate.theme-0 .templt-desc {display:none;}

.popupTemlate.theme-1 {background:url(/common/img/basic/promotion/pop_temp_01_bak.png) repeat-x 50% 50%; background-size:contain;}
.popupTemlate.theme-1:after {content:""; display:block; position:absolute; bottom:0; left:0; right:0; height:11em; max-height:90%; background:url(/common/img/basic/promotion/pop_temp_01_acc1.svg) no-repeat 0 100%, url(/common/img/basic/promotion/pop_temp_01_acc2.svg) no-repeat 100% 100%; background-size:contain, contain !important;}
.popupTemlate.theme-1 .frame {top:1.2em; left:1em; right:1em; bottom:1.2em; border-radius:1em; background:#fff; z-index:0;}
.popupTemlate.theme-1 .templ > * {padding:1em 2.5em;}

.popupTemlate.theme-2 {background:url(/common/img/basic/promotion/pop_temp_02_bak.png) no-repeat 50% 50%; background-size:auto 100%;}
.popupTemlate.theme-2:after {content:""; display:block; position:absolute; bottom:0; left:0; right:0; height:6em; max-height:50%; background:url(/common/img/basic/promotion/pop_temp_02_acc1.svg) no-repeat 0 100%, url(/common/img/basic/promotion/pop_temp_02_acc2.svg) no-repeat 100% 100%; background-size:contain, contain !important;}
.popupTemlate.theme-2 .frame {top:1.2em; left:1em; right:1em; bottom:1.2em; border-radius:1em; background:#fff; z-index:0;}
.popupTemlate.theme-2 .templ > * {padding:1em;}

.popupTemlate.theme-3 {background:#FFE976;}
.popupTemlate.theme-3:after {content:""; display:block; position:absolute; top:0; left:0; right:0; height:10em; max-height:55%; background:url(/common/img/basic/promotion/pop_temp_03_acc1.svg) no-repeat 0 0, url(/common/img/basic/promotion/pop_temp_03_acc2.svg) no-repeat 100% 0; background-size:contain, contain !important;}
.popupTemlate.theme-3 .frame {top:2em; left:0; right:0; bottom:0; padding:0; z-index:0;}
.popupTemlate.theme-3 .frame:before {content:""; display:block; position:absolute; top:0; left:50%; bottom:0; width:32.95em; max-width:110%; background:url(/common/img/basic/promotion/pop_temp_03_bak.svg) no-repeat 50% 0; transform:translateX(-50%); -webkit-transform:translateX(-50%); background-size:cover !important; z-index:-1;}
.popupTemlate.theme-3 .templ > * {padding:1em;}

.popupTemlate.theme-4 {background:#5AD0DE;}
.popupTemlate.theme-4:after {content:""; display:block; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); width:47.1em; height:27.5em; max-width:162.45%; background:url(/common/img/basic/promotion/pop_temp_04_acc1.svg) no-repeat 0 0, url(/common/img/basic/promotion/pop_temp_04_acc2.svg) no-repeat 100% 0; background-size:auto 100%, auto 100% !important; z-index:-2;}
.popupTemlate.theme-4 .frame {top:1.2em; left:1em; right:1em; bottom:1.2em; border-radius:1em; background:#fff; z-index:0;}

.popupTemlate.theme-5 {background:#F6F4E7;}
.popupTemlate.theme-5:after {content:""; display:block; position:absolute; top:0; left:0; right:0; bottom:0; z-index:-2;
	background: url(/common/img/basic/promotion/pop_temp_05_acc1.svg) no-repeat 100% 0,
				url(/common/img/basic/promotion/pop_temp_05_acc2.svg) no-repeat 0 100%,
				url(/common/img/basic/promotion/pop_temp_05_acc3.svg) no-repeat bottom 50% left 0,
				url(/common/img/basic/promotion/pop_temp_05_acc4.svg) no-repeat top 50% right 0,
				url(/common/img/basic/promotion/pop_temp_05_acc5.svg) no-repeat 100% 100%,
				url(/common/img/basic/promotion/pop_temp_05_acc6.svg) no-repeat 0 0;
	background-size:5.5em auto, 5.5em auto, 7.5em auto, 7.5em auto, 10.5em auto, 10.5em auto !important;
}
.popupTemlate.theme-5 .frame {top:1em; left:1em; right:1em; bottom:1em; z-index:0;}
.popupTemlate.theme-5 .templ > * {padding:1em;}