@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+KR:100,300,400,500,700,900');
@import url('https://fonts.googleapis.com/icon?family=Material+Icons|Material+Icons+Outlined|Material+Icons+Two+Tone|Material+Icons+Round|Material+Icons+Sharp|Material+Icons+Round');

* {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}

html {margin:0; padding:0; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%;}
body {height:100%;}
html {overflow-y:scroll;}
body, p, ul, ol, li, dl, dt, dd, form, table, th, td, fieldset, input, textarea, select, button, h1, h2, h3, h4, h5, h6, pre {
	-webkit-text-size-adjust:none; 
	font-family: 'Noto Sans KR', sans-serif !important;
	padding: 0; 
	margin: 0;	
	color: #333; 
	letter-spacing:-0.5px; 
	line-height:1.4;
	font-size: 13px;
}
body, input, textarea, select, button {color:#585858; font-size:12px;}
header, footer, nav, aside, section, article {display:block;} 
fieldset, img {border:0;} 
img {-ms-interpolation-mode:bicubic !important; border:0;}
table {padding:0; border-spacing:0px; border:0; border-collapse:collapse;} 
ul, ol {list-style:none;} 
a {color:#585858; text-decoration:none;} 
a:link {color:#606060; text-decoration:none;} 
a:hover {color:#ffa172;} 
.clear { clear:both; }

::-webkit-input-placeholder { color: #999;}
::-moz-placeholder { color: #999;}
:-ms-input-placeholder { color: #999;}
:-moz-placeholder { color: #999;}

select { height:25px; line-height:25px; border: 1px solid #ccc; vertical-align:middle; box-sizing:border-box;}
input[type=text], 
input[type=password] { height:25px; line-height:25px; border: 1px solid #ccc; padding: 0; text-indent:10px; vertical-align:middle; box-sizing:border-box; font-size: 15px;}
textarea { border: 1px solid #ccc; padding: 0; vertical-align:middle; box-sizing:border-box;}

.loginWrap { height:880px; background: url(../images/public/bg2.jpg) center no-repeat; background-size: 100% 880px; z-index:0; color: #333;}
.loginBox { margin: 0 auto; width: 520px; padding: 20px 0 30px 0; box-sizing: border-box; border: 1px solid #fff; box-shadow:0 0 15px #aaa; border-radius:3px; background: rgba(255,255,255,0.3);}
.loginBox > div { width: 460px; margin: 0 auto;}
.loginBox > div > div:nth-child(1) { text-align:left; font-size: 13px;}
.loginBox > div > div:nth-child(1) strong { font-size:20px; font-weight:700; display:block;}
.loginBox > div > div:nth-child(2) {font-size: 0; margin-top: 20px;}
.loginBox > div > div:nth-child(2) > div { display:inline-block; vertical-align:top;}
.loginBox > div > div:nth-child(2) > div:nth-child(1) { width: 350px;}
.loginBox > div > div:nth-child(2) > div:nth-child(1) > div { height:45px;}
.loginBox > div > div:nth-child(2) > div:nth-child(1) > div p { display:inline-block; vertical-align:middle;}
.loginBox > div > div:nth-child(2) > div:nth-child(1) > div p:nth-child(1) {width:84px; font-size:18px; color:#666; font-weight:600;}
.loginBox > div > div:nth-child(2) > div:nth-child(1) > div p:nth-child(2) {width:258px;}
.loginBox > div > div:nth-child(2) > div:nth-child(1) > div p:nth-child(2) input { width: 100%; height:45px; box-sizing:border-box; border: 1px solid #dbdbdb; border-radius:3px; background-color: #dbdbdb; font-size: 18x;}
.loginBox > div > div:nth-child(2) > div:nth-child(2) p { width: 110px; height: 102px; box-sizing: border-box; border: 1px solid #010101; background-color: #3e4346; font-weight:700; color: #fff; text-align:center; line-height:100px; border-radius:3px; font-size:24px; cursor: pointer;}

.telNumber { text-align:center; font-size:24px; font-weight:500; margin-top:30px; text-shadow: 0px 1px 0px #fff; letter-spacing:-2px; font-weight:400;}

.top { height:628px; background: url(../images/public/bg1.jpg) center top no-repeat; background-size: 100% 628px; z-index:0;}

.slogan { height:43px; text-align:center;}
.slogan > div { display:inline-block; font-size: 0; vertical-align:top;} 
.slogan > div > p { display:inline-block; vertical-align:top;}
.slogan > div > p.logo { width: 143px; height:43px; background-size: contain !important;}
.slogan > div > p.slogan1 {width: 166px; height:43px; line-height:1.2; box-sizing:border-box; margin: 0 1px; padding-top: 3px; background: #2a2e31; color:#fff; text-align:center; font-weight:500;}
.slogan > div > p.slogan1 strong {font-size: 17px; font-weight: 700;}
.slogan > div > p.slogan2 {width: 166px; height:43px; line-height:1.3; box-sizing:border-box; margin: 0 1px; padding-top: 3px; background: #db8644; color:#fff; text-align:center; font-weight:500;}
.slogan > div > p.slogan2 strong {font-size: 15px; font-weight: 700;}

.title { height:255px; font-size:0; text-align:center;}
.title .title1 { padding-top: 51px; font-size: 54px; font-weight: 900; color:#333; letter-spacing:-3px; line-height:1.2; text-shadow: 0px 1px 0px #fff;}
.title .title1 strong {color: #5ab0ad;}
.title .title1_1 {font-size: 50px;}
.title .title2 { width: 669px; height:30px; padding-top: 2px; box-sizing:border-box; background: #2a2e31; margin: 0 auto; margin-top: 8px; color:#fff; font-size: 16px;}
.title .title2 strong { font-weight:500;}
.title .title2 span { display:inline-block; font-size:9px; vertical-align:middle; margin: 0 13px; margin-bottom:5px;}
.title .title2 span.block1 {font-size: 13px; white-space: nowrap; margin-bottom:2px;}
.title .title2_1 { width: 830px;}
.title .title3 { width: 669px; margin: 0 auto; margin-top: 11px; padding: 2px 0 3px 0; color:#333; font-size: 15px; text-shadow: 0px 1px 0px #fff; font-weight:500; border-top: 1px solid #333; border-bottom: 1px solid #333;}
.title .title3 strong { font-weight:700;}
.title .title3 strong span { color: #f29a76;}
.title .title3_1 { width: 830px;}
.title_login {margin-top: 180px; height: 165px;}
.title_login_1 {}
.title_login_1 .title1 { padding-top: 51px; font-size: 42px; font-weight: 900; color:#333; letter-spacing:-3px; line-height:1.2; text-shadow: 0px 1px 0px #fff;}
.title_login_1 .title1 strong {color: #5ab0ad;}
.title_login_1 .title1_1 { padding-top: 51px; font-size: 40px; font-weight: 900; color:#333; letter-spacing:-3px; line-height:1.2; text-shadow: 0px 1px 0px #fff;}
.title_login_1 .title2 { width: 520px; height:30px; padding-top: 5px; box-sizing:border-box; background: #2a2e31; margin: 0 auto; margin-top: 8px; color:#fff; font-size: 14px;}
.title_login_1 .title2 strong { font-weight:500;}
.title_login_1 .title2 span { display:inline-block; font-size:9px; vertical-align:middle; margin: 0 13px; margin-bottom:5px;}
.title_login_1 .title2 span.block1 {font-size: 12px; white-space: nowrap; margin-bottom:2px;}
.title_login_1 .title2_1 { width: 640px;}
.title_login_1 .title3 { width: 520px; margin: 0 auto; margin-top: 11px; padding: 2px 0 3px 0; color:#333; font-size: 15px; text-shadow: 0px 1px 0px #fff; font-weight:500; border-top: 1px solid #333; border-bottom: 1px solid #333;}
.title_login_1 .title3 strong { font-weight:700;}
.title_login_1 .title3 strong span { color: #f29a76;}
.title_login_1 .title3_1 { width: 640px;}

.subTitle { width:1100px; height:330px; margin: auto; position:relative; text-shadow: 0px 1px 0px #fff;}
.subTitle1 .subTitleBg { position:absolute; left: 0; top: 0; width: 100%; height:100%;background:url(../images/public/subtitle1.png) center no-repeat;}
.subTitle2 .subTitleBg { position:absolute; left: 0; top: 0; width: 100%; height:100%;background:url(../images/public/subtitle2.png) center no-repeat;}
.subTitle3 .subTitleBg { position:absolute; left: 0; top: 0; width: 100%; height:100%;background:url(../images/public/subtitle3.png) center no-repeat;}
.subTitle1 .subTitleText,
.subTitle2 .subTitleText,
.subTitle3 .subTitleText { position:relative;}
.subTitle1 .subTitleText .subTitleText1 { font-size: 26px; color:#333; font-weight: 500; padding-left: 80px;}
.subTitle1 .subTitleText .subTitleText1 p { display:inline-block; color:#fff; padding: 3px 10px; margin-bottom: 3px; vertical-align:middle; margin-right:3px; cursor:pointer; font-weight:normal;}
.subTitle1 .subTitleText .subTitleText1 p:nth-child(1) {background-color: #5ab0ad; text-shadow: none;}
.subTitle1 .subTitleText .subTitleText1 p:nth-child(2) {background-color: #db8644; text-shadow: none;}
.subTitle1 .subTitleText .subTitleText2 { font-size: 15px; font-weight:400; padding-top: 7px; padding-left: 70px;}
.subTitle1 .subTitleText .subTitleText3 { padding-top: 12px; padding-left: 70px;}
.subTitle1 .subTitleText .subTitleText3 div { font-size:0; margin-bottom: 3px; font-weight:normal; text-shadow: none;}
.subTitle1 .subTitleText .subTitleText3 div p { display:inline-block; background: #bfbfbf; vertical-align:top;}
.subTitle1 .subTitleText .subTitleText3 div p:nth-child(1) { width: 154px; height:27px; line-height:26px; background: #2a2e31; color:#fff; font-size: 13px; text-align:center; font-weight:400;}
.subTitle1 .subTitleText .subTitleText3 div p:nth-child(2) { color: #333; font-size: 13px; height:27px; line-height:26px; padding: 0 10px; white-space:nowrap;}
.subTitle1 .subTitleText .subTitleText3 div p strong { font-size: 15px; font-weight:700;}
.subTitle1 .subTitleText .subTitleText3 div p span { display:inline-block; vertical-align:middle; margin: 0 10px; margin-bottom: 5px; font-size: 8px;}
.subTitle2 .subTitleText .subTitleText1 { font-size: 26px; color:#333; font-weight: 500; padding-left: 220px;}
.subTitle2 .subTitleText .subTitleText1 p { display:inline-block; color:#fff; padding: 3px 10px; margin-bottom: 3px; vertical-align:middle; margin-right:3px; cursor:pointer; font-weight:normal;}
.subTitle2 .subTitleText .subTitleText1 p:nth-child(1) {background-color: #5ab0ad; text-shadow: none;}
.subTitle2 .subTitleText .subTitleText1 p:nth-child(2) {background-color: #db8644; text-shadow: none;}
.subTitle2 .subTitleText .subTitleText2 { font-size: 15px; font-weight:400; padding-top: 7px; padding-left: 190px;}
.subTitle3 .subTitleText .subTitleText1 { font-size: 26px; color:#333; font-weight: 500; text-align:center;}
.subTitle3 .subTitleText .subTitleText1 p { display:inline-block; color:#fff; padding: 3px 10px; margin-bottom: 3px; vertical-align:middle; margin-right:3px; cursor:pointer; font-weight:normal;}
.subTitle3 .subTitleText .subTitleText1 p:nth-child(1) {background-color: #5ab0ad; text-shadow: none;}
.subTitle3 .subTitleText .subTitleText1 p:nth-child(2) {background-color: #db8644; text-shadow: none;}
.subTitle3 .subTitleText .subTitleText2 { font-size: 15px; font-weight:400; padding-top: 7px; text-align:center;}
.subTitle .colorC1 { color: #db8644;}
.subTitle .colorC2 { color: #44a6e1;}
.subTitle .colorC3 { color: #d43d3d;}

.menuBtnT1 { background:#251f1f; text-align:center; font-size:0; width:100%; z-index:5;}
.menuBtnT1 > div { display:inline-block; vertical-align:top; white-space:nowrap;}
.menuBtnT1 > div > div { background: #959595; height: 84px; line-height:84px; display:inline-block; vertical-align:middle;width: 185px; margin-right:1px; cursor:pointer; position:relative;}
.menuBtnT1 > div > div > p { font-size: 15px; color:#464040; line-height:1.4; display:inline-block; vertical-align:middle;}
.menuBtnT1 > div > div > p strong { color:#251f1f; font-size:20px; display:block;}
.menuBtnT1 > div > div:hover { background: #666;}
.menuBtnT1 > div > div:hover > p { color:#fff;}
.menuBtnT1 > div > div:hover > p strong { color:#fff;}
.menuBtnT1 > div > div > span { position:absolute; left: 0; bottom: 0; width: 100%; height:5px; display:none;}
.menuBtnT1 > div > .menuBtn1On { background:#251f1f; cursor:default;}
.menuBtnT1 > div > .menuBtn1On > p { color:#fff; font-size: 18px;}
.menuBtnT1 > div > .menuBtn1On > p strong { color:#63e6e1; font-size: 26px;}
.menuBtnT1 > div > .menuBtn1On > span { display:block; background: #5ab0ad;}
.menuBtnT1 > div > .menuBtn1On:hover { background: #251f1f;}
.menuBtnT1 > div > .menuBtn1On:hover > p { color:#fff;}
.menuBtnT1 > div > .menuBtn1On:hover > p strong { color:#63e6e1;}
.menuBtnT1 > div > .menuBtn2On { background:#251f1f; cursor:default;}
.menuBtnT1 > div > .menuBtn2On > p { color:#fff; font-size: 18px;}
.menuBtnT1 > div > .menuBtn2On > p strong { color:#ee9753; font-size: 26px;}
.menuBtnT1 > div > .menuBtn2On > span { display:block; background: #db8644;}
.menuBtnT1 > div > .menuBtn2On:hover { background: #251f1f;}
.menuBtnT1 > div > .menuBtn2On:hover > p { color:#fff;}
.menuBtnT1 > div > .menuBtn2On:hover > p strong { color:#ee9753;}
.menuBtnT1 > div > .menuBtn3On { background:#251f1f; cursor:default;}
.menuBtnT1 > div > .menuBtn3On > p { color:#fff; font-size: 18px;}
.menuBtnT1 > div > .menuBtn3On > p strong { color:#ffe400; font-size: 26px;}
.menuBtnT1 > div > .menuBtn3On > span { display:block; background: #ffe400;}
.menuBtnT1 > div > .menuBtn3On:hover { background: #251f1f;}
.menuBtnT1 > div > .menuBtn3On:hover > p { color:#fff;}
.menuBtnT1 > div > .menuBtn3On:hover > p strong { color:#ffe400;}

section.search {  display: flex; width: 100%; background: #313131; color: #fff; justify-content: center; z-index:5;}
section.search .searchSkin { position: relative; z-index: 1; flex: 0 0 auto; display: flex; align-items: center; justify-content: center; gap: 10px; padding: 20px 0;}
section.search .searchSkin > p > input[type="text"]  { width: 300px; height: 40px; border-radius: 50px; background: #eee; text-align: center; font-size: 15px;}
section.search .searchSkin > p > select { width: auto; height: 40px; padding: 0 15px; border-radius: 50px; background: #eee; text-align: center; font-size: 15px;}
section.search .searchSkin > p { font-size: 20px; font-weight: 600; color: #fff;}
section.search .searchSkin > p > span { cursor: pointer; margin-top: 3px;}
section.search .searchSkin > p.deleteSearch { display: flex; align-items: center; font-size: 15px; display: none; cursor: pointer;}

.menuBtnT2 { position:fixed;box-shadow:0 0 15px #000;left: 0; top: 0;}
.menuBtnT2 > div { display:inline-block; vertical-align:top; white-space:nowrap;}
.menuBtnT2 > div > div { background: #959595; height: 84px; line-height:84px; display:inline-block; vertical-align:middle;width: 185px; margin-right:1px; cursor:pointer; position:relative;}
.menuBtnT2 > div > div > p { font-size: 15px; color:#464040; line-height:1.4; display:inline-block; vertical-align:middle;}
.menuBtnT2 > div > div > p strong { color:#251f1f; font-size:20px; display:block;}
.menuBtnT2 > div > div:hover { background: #666;}
.menuBtnT2 > div > div:hover > p { color:#fff;}
.menuBtnT2 > div > div:hover > p strong { color:#fff;}
.menuBtnT2 > div > div > span { position:absolute; left: 0; bottom: 0; width: 100%; height:5px; display:none;}
.menuBtnT2 > div > .menuBtn1On { background:#251f1f; cursor:default;}
.menuBtnT2 > div > .menuBtn1On > p { color:#fff; font-size: 18px;}
.menuBtnT2 > div > .menuBtn1On > p strong { color:#63e6e1; font-size: 26px;}
.menuBtnT2 > div > .menuBtn1On > span { display:block; background: #5ab0ad;}
.menuBtnT2 > div > .menuBtn1On:hover { background: #251f1f;}
.menuBtnT2 > div > .menuBtn1On:hover > p { color:#fff;}
.menuBtnT2 > div > .menuBtn1On:hover > p strong { color:#63e6e1;}
.menuBtnT2 > div > .menuBtn2On { background:#251f1f; cursor:default;}
.menuBtnT2 > div > .menuBtn2On > p { color:#fff; font-size: 18px;}
.menuBtnT2 > div > .menuBtn2On > p strong { color:#ee9753; font-size: 26px;}
.menuBtnT2 > div > .menuBtn2On > span { display:block; background: #db8644;}
.menuBtnT2 > div > .menuBtn2On:hover { background: #251f1f;}
.menuBtnT2 > div > .menuBtn2On:hover > p { color:#fff;}
.menuBtnT2 > div > .menuBtn2On:hover > p strong { color:#ee9753;}
.menuBtnT2 > div > .menuBtn3On { background:#251f1f; cursor:default;}
.menuBtnT2 > div > .menuBtn3On > p { color:#fff; font-size: 18px;}
.menuBtnT2 > div > .menuBtn3On > p strong { color:#ffe400; font-size: 26px;}
.menuBtnT2 > div > .menuBtn3On > span { display:block; background: #ffe400;}
.menuBtnT2 > div > .menuBtn3On:hover { background: #251f1f;}
.menuBtnT2 > div > .menuBtn3On:hover > p { color:#fff;}
.menuBtnT2 > div > .menuBtn3On:hover > p strong { color:#ffe400;}

.listThumb { margin: 0 auto; width: 1280px; z-index:0; background: #313131;display: flex; align-items: flex-start; justify-content: center;}
.listThumb .designList > ul {list-style-type: none;position: relative;margin: 0; display: inline-flex; align-items: flex-start; justify-content: flex-start;}
.listThumb .designList > ul > li {width: 278px;background-color: #ffffff;border: 1px solid #dedede;border-radius: 8px;display: none;padding: 7px; cursor: pointer;}
.listThumb .designList > ul > li > img { vertical-align:top; display:block; cursor:pointer; width: 278px;}
.listThumb .designList > ul > li > p { display:block; background: #e5e5e5; text-align:center; color:#333; font-size: 15px; height:38px; line-height:37px; font-weight:500; position: relative;}
.listThumb .designList > ul > li > p > span { display:inline-block; border-radius:3px; color: #fff; font-size: 12px; cursor:pointer; line-height:1.4; padding: 3px 5px 4px 5px; vertical-align:middle; margin-bottom: 2px; font-weight:normal;}
.listThumb .designList > ul > li > p > span.skinName { font-size: 15px; color:#333; paddding-right: 5px;}
.listThumb .designList > ul > li > p > span.oderBtn { background: #5ab0ad;}
.listThumb .designList > ul > li > p > span.siteBtn { background: #db8644; margin-left: 0;}
.listThumb .designList > ul > li > span{ position:absolute; top: -1px; right: -1px;}


.banner {border-bottom: 1px solid #d2d2d2; text-align:center; background: #fff; z-index:0;}
.banner img { vertical-align:top;}

.footer { text-align: center; padding: 25px 0; font-size: 13px; color:#999; background: #fff; line-height:1.6; z-index:0;}
.footer strong { color: #666; font-weight:normal;}

.cateTab {margin-top: 70px; display: flex; justify-content: center;}
.cateTab > div { display: flex; width: 1200px; justify-content: center; gap: 1px; border-radius: 5px; overflow: hidden;}
.cateTab > div > a { flex: 1; display: flex; align-items: center; justify-content: center; padding: 10px; background: rgba(255,255,255,1); box-sizing: border-box; font-size: 15px; text-align: center;}
.cateTab > div > a:hover {color: #63e6e1;}
.cateTab > div > a.on { background: #63e6e1; color: #fff;}
.cateTab > div > a.on:hover { color: #fff;}

@media all and (max-width:1300px){
	.subTitle { width:100%;}

	.listThumb { width: 100%;}
	.listThumb .designList > ul > li {width: 260px;}
	.listThumb .designList > ul > li > img { width: 260px;}

	.cateTab { padding: 0 20px;}
}

@media all and (max-width:1000px){
	.cateTab > div { flex-wrap: wrap; justify-content: space-between; width: 100%; font-size: 0;}
	.cateTab > div > a { flex: 0 0 calc((100% - 3px) / 4); font-size: 15px;}
	.cateTab > div > a:last-child { flex-grow: 1;}
}

@media all and (max-width:700px){
	.cateTab > div > a { flex: 0 0 calc((100% - 2px) / 3);}
}

@media all and (max-width:700px){			
	.loginWrap { height: auto; background-size: cover; padding-bottom: 100px;}
	.loginBox { width: 85%; padding: 20px 20px 30px 20px; margin-top: 15px;}
	.loginBox > div { width: 100%;}
	.loginBox > div > div:nth-child(1) { font-size: 11px;}
	.loginBox > div > div:nth-child(1) strong { font-size:15px;}
	.loginBox > div > div:nth-child(1) .block1 { display: block;}
	.loginBox > div > div:nth-child(2) {font-size: 0; margin-top: 20px;}
	.loginBox > div > div:nth-child(2) > div { display:block;}
	.loginBox > div > div:nth-child(2) > div:nth-child(1) { width: 100%;}
	.loginBox > div > div:nth-child(2) > div:nth-child(1) > div { height:35px;}
	.loginBox > div > div:nth-child(2) > div:nth-child(1) > div p { display:inline-block; vertical-align:middle;}
	.loginBox > div > div:nth-child(2) > div:nth-child(1) > div p:nth-child(1) {width:20%; font-size:13px; color:#666; font-weight:600;}
	.loginBox > div > div:nth-child(2) > div:nth-child(1) > div p:nth-child(2) {width:80%;}
	.loginBox > div > div:nth-child(2) > div:nth-child(1) > div p:nth-child(2) input { height:35px; font-size: 13x;}
	.loginBox > div > div:nth-child(2) > div:nth-child(2) p { width: 100%; height: 35px; line-height:33px;font-size:15px; margin-top: 12px;}
	
	.top { height:auto; background: url(../images/public/bg2.jpg) center top no-repeat; background-size: cover; z-index:0; padding-bottom: 50px;}
	
	.slogan { height:33px;}
	.slogan > div > p.logo { width: 80px; height:33px;}
	.slogan > div > p.slogan1 {width: 110px; height:33px; margin: 0 1px; padding-top: 2px; font-size: 11px;}
	.slogan > div > p.slogan1 strong {font-size: 12px;}
	.slogan > div > p.slogan2 {width: 120px; height:33px; line-height:1.3;padding-top: 2px; font-size: 11px;}
	.slogan > div > p.slogan2 strong {font-size: 11px;}
	
	.title { height:auto; margin-top: 50px;}
	.title .title1 { padding-top: 0; font-size: 22px;letter-spacing:-1px;}
	.title .title2 { width: 85%; height:auto; padding-top: 2px; padding-bottom: 1px; margin-top: 8px;font-size: 12px;}
	.title .title2 .block1 { display:block;}
	.title .title3 { width: 85%;margin-top: 8px; padding: 2px 0 3px 0; font-size: 12px;}
	.title .title3 .block1 { display:block;}
	.title_login {margin-top: 100px; height: auto;}
	
	.subTitle { width:85%; height:auto; margin: auto; margin-top: 30px;}
	.subTitle1 .subTitleBg { display:none;}
	.subTitle2 .subTitleBg { display:none;}
	.subTitle3 .subTitleBg { display:none;}
	.subTitle1 .subTitleText,
	.subTitle2 .subTitleText,
	.subTitle3 .subTitleText { position:relative;}
	.subTitle1 .subTitleText .subTitleText1 { font-size: 15px;padding-left: 0;}
	.subTitle1 .subTitleText .subTitleText1 p { padding: 3px 10px; font-size:11px;}
	.subTitle1 .subTitleText .subTitleText2 { font-size: 12px; padding-left: 0;}
	.subTitle1 .subTitleText .subTitleText3 { padding-top: 11px; padding-left: 0;}
	.subTitle1 .subTitleText .subTitleText3 div p:nth-child(1) { width: 100px; display:block; height:20px; line-height:19px;font-size: 12px;}
	.subTitle1 .subTitleText .subTitleText3 div p:nth-child(2) { font-size: 12px; height:auto; line-height:1.2; padding: 5px; white-space:normal; width: 100%; box-sizing: border-box;}
	.subTitle1 .subTitleText .subTitleText3 div p strong { font-size: 13px;}
	.subTitle2 .subTitleText .subTitleText1 { font-size: 15px;padding-left: 0;}
	.subTitle2 .subTitleText .subTitleText1 p { display:block;}
	.subTitle2 .subTitleText .subTitleText2 { font-size: 12px;padding-left: 0;}
	.subTitle3 .subTitleText .subTitleText1 { font-size: 15px; text-align:left;}
	.subTitle3 .subTitleText .subTitleText2 { font-size: 12px; text-align: left;}
	.subTitle .colorC1 { color: #db8644;}
	.subTitle .colorC2 { color: #44a6e1;}
	.subTitle .colorC3 { color: #d43d3d;}
	
	.menuBtnT1 { background:#251f1f; text-align:center; font-size:0; left: 0; top: 0; width:100%; height:104px; z-index:5;}
	.menuBtnT1 > div { display:block; white-space: normal;}
	.menuBtnT1 > div > div { height: 52px; line-height:52px;width: 50%; margin-right:0; white-space:nowrap;}
	.menuBtnT1 > div > div > p { font-size: 13px;line-height:1.4;}
	.menuBtnT1 > div > div > p strong { font-size:15px;}
	.menuBtnT1 > div > div > span {height:2px; display:none;}
	.menuBtnT1 > div > .menuBtn1On > p { font-size: 13px;}	
	.menuBtnT1 > div > .menuBtn1On > p strong { font-size: 18px;}
	.menuBtnT1 > div > .menuBtn2On > p { font-size: 13px;}
	.menuBtnT1 > div > .menuBtn2On > p strong { font-size: 18px;}
	.menuBtnT1 > div > .menuBtn3On > p { font-size: 13px;}
	.menuBtnT1 > div > .menuBtn3On > p strong { font-size: 18px;}
	
	.menuBtnT2 { background:#251f1f; text-align:center; font-size:0; left: 0; top: 0; width:100%; height:104px; z-index:5; display:none;}
	.menuBtnT2 > div { display:block; white-space: normal;}
	.menuBtnT2 > div > div { height: 52px; line-height:52px;width: 50%; margin-right:0; white-space:nowrap;}
	.menuBtnT2 > div > div > p { font-size: 13px;line-height:1.4;}
	.menuBtnT2 > div > div > p strong { font-size:15px;}
	.menuBtnT2 > div > div > span {height:2px; display:none;}
	.menuBtnT2 > div > .menuBtn1On > p { font-size: 13px;}	
	.menuBtnT2 > div > .menuBtn1On > p strong { font-size: 18px;}
	.menuBtnT2 > div > .menuBtn2On > p { font-size: 13px;}
	.menuBtnT2 > div > .menuBtn2On > p strong { font-size: 18px;}
	.menuBtnT2 > div > .menuBtn3On > p { font-size: 13px;}
	.menuBtnT2 > div > .menuBtn3On > p strong { font-size: 18px;}
	.menuBtnT2 .gotop { display: none;}
	
	.listThumb { margin: 40px auto; width: 100%; z-index:0;}
	.listThumb .designList > ul > li {width: 158px;background-color: #ffffff;border: 1px solid #dedede;border-radius: 4px;display: none;padding: 3px;}
	.listThumb .designList > ul > li > img { vertical-align:top; display:block; cursor:pointer; width: 158px;}
	.listThumb .designList > ul > li > p { display:block; font-size: 13px; height:auto; line-height:1.4; padding-bottom: 5px;}
	.listThumb .designList > ul > li > p > span { display:inline-block; border-radius:3px; color: #fff; font-size: 11px; cursor:pointer; line-height:1.4; padding: 3px 4px 4px 4px; vertical-align:middle; margin-bottom: 2px; font-weight:normal;}
	.listThumb .designList > ul > li > p > span.skinName { display:block; font-size: 15px; color:#333; paddding-right: 0;}
	.listThumb .designList > ul > li > span{ position:absolute; top: -1px; right: -1px;}
	
	.banner { display:none;}
	
	.footer { padding: 25px; font-size: 11px;}
}

.deviceWrap object { border: none; outline: none;}
.deviceWrap { position: fixed; left: 0; top: 0; right: 0; bottom: 0; z-index: 999; background: rgba(0,0,0,0.5); display: flex;}
.deviceWrap > div { display: inline-flex; flex-direction: column; margin: auto; width: 90%; height: 90%; border-radius: 25px; overflow: hidden; background: #323232; border: 8px solid #323232; box-sizing: border-box;}

.deviceWrap > div .onlySample { display: flex; align-items: center; justify-content: center; font-size: 13px; border-bottom: 1px solid #d2d2d2; padding: 0 0 8px 0; flex: 0 0 auto;}
.deviceWrap > div .onlySample > div { flex-grow: 1; display: flex; align-items: center; justify-content: center; font-weight: 600; gap: 10px; color: #fff;}
.deviceWrap > div .onlySample > div > p { font-weight: normal; padding: 4px 8px; border-radius: 3px; background: #eee; display: flex; align-items: center; justify-content: center; gap: 3px; cursor: pointer; color: #000;}
.deviceWrap > div .onlySample > div > p.deviceOn { background: #00a0e9; color: #fff;}
.deviceWrap > div .onlySample > div > p .material-icons { font-size: 13px;}
.deviceWrap > div .onlySample > p { flex: 0 0 auto; display: flex; align-items: center; justify-content: center; color: #fff;}
.deviceWrap > div .onlySample > p { flex: 0 0 auto; display: flex; align-items: center; justify-content: center; cursor: pointer; padding: 5px 10px;}
.deviceWrap > div .onlySample > p .material-icons { font-size: 15px;}

.deviceWrap > div > object { flex-grow: 1; width: 100%;}

	@media all and (max-width:) {
	}