@charset "utf-8";

/*******************************************
	Scroll Control Style
*******************************************/

body.stateOpenMainsite {overflow:hidden;}
body.stateOpenMainsite #headerWrap:before {content:""; display:block; position:fixed; top:0; left:0; right:0; bottom:0; z-index:11; background:rgba(0,0,0,.6);}


/*******************************************
	Default Layout
*******************************************/

#mainSite {display:none; position:fixed; top:0; left:0; right:0; bottom:0; z-index:9999; font-size:20px;}
#mainSite .siteArea {display:block; position:absolute; top:50%; left:50%; width:1400px; height:660px; margin:-330px 0 0 -700px; background:url(../img/mainSite/bak_popup.png) no-repeat 0 100% #118FE3; border-radius:1em;}
#mainSite #closeMainsite {display:block; position:absolute; top:0; right:0; margin:2em -2.533334em 0 0; width:6.266667em; height:6.266667em; background:url(../img/mymenu/btn_pop_close.svg) no-repeat 50% 50%; background-size:contain; text-indent:-999px; overflow:hidden; border:none;}
#mainSite .deco-logo {position:absolute; bottom:1.5em; left:7.5em; width:5.9em; height:2em; background:url(../img/mymenu/img_login.svg) no-repeat 50% 50%; background-size:auto 100%; text-indent:-999px; overflow:hidden;}

#mainSite .tit {position:relative; padding:2.5em 3em;}
#mainSite .tit span {display:block; position:relative; height:1.5em; margin:0 0 .5em; background:url(../img/mainsite/txt_intro_title.svg) no-repeat 0 50%; background-size:auto 100%; text-indent:-999px; overflow:hidden;}
#mainSite .tit strong {font-family:'TTWanjudaedunsancheB',Helvetica,Arial,sans-serif; color:#fff; font-size:2.2em; word-break:keep-all; line-height:120%;}
#mainSite .tit strong br {display:none;}
#mainSite .tit .deco {display:block; height:9em; width:31.5em; position:absolute; right:0; bottom:0; background:url(../img/mainsite/img_obj1.svg) no-repeat 100% 100%; background-size:auto 100%;}

#mainSite .tapArea {position:absolute; top:0; left:0; bottom:0; width:21em; margin-top:9em; padding:0 2em; z-index:1;}
#mainSite .tapArea .cate {display:block; position:relative; height:19.25em; overflow-y:auto;}
#mainSite .tapArea .cate a {display:block; position:relative; margin:0.5em auto; width:15em; height:3.25em; background-color:#0976CE; border-radius:9em; padding:.9em 1.5em;}
#mainSite .tapArea .cate a:hover {background-color:#005CB9;}
#mainSite .tapArea .cate a.active {background:url(../img/mymenu/ico_intro_tab.svg) no-repeat top 50% right .8em #005CB9; background-size:1.8em auto;}
#mainSite .tapArea .cate span {display:block; position:relative; font-size:1em; color:#fff; font-weight:500; line-height:1.5em;}
#mainSite .tapArea .cate::-webkit-scrollbar {width:10px;}
#mainSite .tapArea .cate::-webkit-scrollbar-thumb {border:none; border-radius:20px; background:rgba(0,0,0,0.1);}
#mainSite .tapArea .nodata {padding:5em 1em; border-radius:2em; border:1px dashed rgba(255,255,255,0.4); text-align:center; color:#fff;}


#mainSite .pannel {position:absolute; top:9.2em; left:21em; bottom:0; right:0; padding:2.5em 3em; border-radius:3em 0 1em 0; box-shadow:.5em .5em 2.5em 0 rgba(0,0,0,.18); background:#fff; z-index:0;}
#mainSite .pannel > .in {display:block; position:relative; height:18.8em; overflow-x:hidden; overflow-y:auto;}
#mainSite .pannel > .in::-webkit-scrollbar {width:10px;}
#mainSite .pannel > .in::-webkit-scrollbar-thumb {border:none; border-radius:20px; background:rgba(0,0,0,0.1);}
#mainSite .pannel .nodata {padding:5em 1em; border-radius:1.5em; border:1px dashed #d1d1d1; text-align:center; color:#666;}

#mainSite .mainsiteList {display:flex; flex-wrap:wrap; margin:-.5em;}
#mainSite .mainsiteList li {padding:.5em; width:33.33%;}
#mainSite .mainsiteList li a {display:block; height:100%; padding:1.1em; border-radius:0.5em; color:#2C2A8B; border:2px solid #2C2A8B; text-align:center;}
#mainSite .mainsiteList li a:hover {font-weight:600; background:#2C2A8B; color:#fff;}

@media all and (max-width:1400px) {
	#mainSite .siteArea {width:auto; left:20px; right:20px; margin-left:0;}
}

@media all and (max-width:1024px) {	
	#mainSite {padding:2em 1em; overflow-y:auto; overflow-x:hidden;}	
	#mainSite .siteArea {position:relative; top:auto; left:auto; right:auto; margin:0 auto; width:580px; max-width:100%; min-width:300px; height:auto; padding-top:1.5em; background:url(../img/mainsite/bak_popup_mo.png) no-repeat 50% 0 #118FE3;}
	#mainSite #closeMainsite {margin:-1.25em -1.25em 0 0;}
	#mainSite .deco-logo {position:relative; bottom:auto; left:50%; transform:translateX(-50%);}
	
	#mainSite .tit {padding:.75em 2em 1.25em; text-align:center;}
	#mainSite .tit span {background-position:50% 50%;}
	#mainSite .tit strong {font-size:1.9em;}
	#mainSite .tit strong br {display:block;}
	#mainSite .tit .deco {display:none;}
	#mainSite .tapArea {margin-top:0; margin-bottom:1em; padding:0 1em;}
	#mainSite .tapArea {width:100%; overflow-x:auto;}
	#mainSite .tapArea .cate {width:max-content; overflow-y:hidden; height:auto;}
	#mainSite .tapArea .cate a {float:left; width:auto; height:auto; font-size:.9em; margin:.5em .25em; padding:.75em 1.5em;}
	#mainSite .tapArea .cate a.active {background:#005CB9 url(../img/mymenu/ico_intro_tab_down.svg) no-repeat right .75em top 50%; padding-right:5em;}
	#mainSite .tapArea::-webkit-scrollbar {height:8px;}
	#mainSite .tapArea::-webkit-scrollbar-thumb {border:none; border-radius:20px; background:rgba(0,0,0,0.1);}
	
	#mainSite .pannel,
	#mainSite .tapArea {position:relative; width:auto; top:auto; left:auto; right:auto; bottom:auto;}
	#mainSite .pannel {padding:1.5em .75em; border-radius:1em;}
	#mainSite .pannel > .in {height:15em;}
	
	#mainSite .mainsiteList {padding:.5em; height:auto; margin-bottom:1em;}
	#mainSite .mainsiteList li {width:50%;}
	#mainSite .mainsiteList li a {font-size:.75em;}
}

@media all and (max-width:550px) {
	#mainSite {font-size:.9em;}
}

@media all and (max-width:410px) {
	#mainSite .tapArea .deco {display:none;}
}