묻고답하기
레이아웃 배경색수정 고수님들 부탁드립니다 ㅠㅠ
2014.07.01 17:20
레이아웃 배경색을 바꿔야하는데요 ㅜㅜccs 열어서 어느부분을 바꾸는지..모르겠네요
@charset "utf-8";
@import url(//fonts.googleapis.com/earlyaccess/nanumgothic.css);
body{position:relative; margin:0; padding:0; font-size:12px}
.cw-container{width:100%; position:relative}
.garden-container{position:relative; width:980px; margin-right:auto; margin-left:auto}
/*--[ Clearfix ]--*/
.newclearfix:after{clear:both; content:' '; display:block; font-size:0; height:0; line-height:0; visibility:hidden; width:0}
* html .newclearfix,:first-child+html .newclearfix{zoom:1}
/*--[ a ]--*/
a, a > *{text-decoration:none; -webkit-transition:background-color .1s ease, border .1s ease, color .1s ease, opacity .1s ease-in-out; -moz-transition:background-color .1s ease, border .1s ease, color .1s ease, opacity .1s ease-in-out; -ms-transition:background-color .1s ease, border .1s ease, color .1s ease, opacity .1s ease-in-out; -o-transition:background-color .1s ease, border .1s ease, color .1s ease, opacity .1s ease-in-out; transition:background-color .1s ease, border .1s ease, color .1s ease, opacity .1s ease-in-out}
a:hover{text-decoration:none}
img,iframe{vertical-align:middle}
/*--[ Skip To Content ]--*/
.skipNav{width:100%; margin:0 auto; background:#fff; text-align:center}
.skipNav a{position:absolute; left:0; top:0; width:1px; height:0; display:block; padding:5px 0; overflow:hidden; color:#999; text-decoration:none; white-space:nowrap}
.skipNav a:hover,.skipNav a:active,.skipNav a:focus{position:relative; height:auto; width:auto}
/* ---------------------------------------------------------------------- */
/* HEADER TOP
/* ---------------------------------------------------------------------- */
#header-top{height:33px; background-color:#3aa6d8; z-index:98}
/* Sign */
.sign-link{float:right}
.sign-link ul{margin:0; padding:0; list-style:none}
.sign-link ul li{float:left; margin:0; padding:9px 0 8px 30px; line-height:1.3}
.sign-link a{display:block; font-family:'Nanum Gothic', 돋움; font-size:13px; font-weight:400; color:#fff; outline:none}
.sign-link a:focus{color:#e1e1e1}
/* Language Select */
.garden-lang{float:right; margin-left:30px}
.garden-lang ul{margin:0; padding:0; list-style:none}
.garden-lang li{position:relative; margin:0; padding:0; line-height:1.2}
.garden-lang li a.langToggle{display:block; padding:9px 0 8px 0; font-family:'Nanum Gothic', 돋움; font-size:13px; font-weight:400; color:#fff}
.garden-lang .langList{display:none; position:absolute; top:33px; left:0; width:100px; background:#fdfdfd}
.garden-lang .langList li a{display:block; padding:8px 16px; border-right:1px solid #e1e1e1; border-left:1px solid #e1e1e1; font-family:Arial, 돋움; font-size:12px; color:#666; white-space:nowrap; cursor:pointer; outline:none}
.garden-lang .langList li:first-child a{border-top:1px solid #e1e1e1}
.garden-lang .langList li:last-child a{border-bottom:1px solid #e1e1e1}
.garden-lang .langList li a:focus,
.garden-lang .langList li a:hover{background-color:#909090; border-right:1px solid #909090; border-left:1px solid #909090; color:#fff}
.garden-lang .langList li:first-child a:focus,
.garden-lang .langList li:first-child a:hover{border-top:1px solid #909090}
.garden-lang .langList li:last-child a:focus,
.garden-lang .langList li:last-child a:hover{border-bottom:1px solid #909090}
/* Search */
#header-top .isearch{float:right; width:170px; margin-left:30px; background:url(../img/opacity08.png); background:rgba(0,0,0,.08)}
#header-top #isearch{margin:0; padding:0}
#header-top #isearch .inputText{float:left; width:120px; height:16px; margin:0; padding:9px 0 8px 10px; border:0; background:none; line-height:1.3; font-size:13px; color:#fff; outline:none}
#header-top #isearch .submit{float:left; width:40px; height:33px; margin:0; padding:0; background:url(../img/isearch.png) no-repeat center center; background-size:50%; border:0; border-radius:0; outline:none; cursor:pointer; -webkit-appearance:none; -webkit-transition:opacity .1s ease-in-out; -moz-transition:opacity .1s ease-in-out; -ms-transition:opacity .1s ease-in-out; -o-transition:opacity .1s ease-in-out; transition:opacity .1s ease-in-out; filter:alpha(opacity=80); opacity:.8; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/isearch.png', sizingMethod='scale'); -ms-filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/isearch.png', sizingMethod='scale')}
#header-top #isearch .submit:hover,
#header-top #isearch .submit:focus{filter:alpha(opacity=100); opacity:1; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/isearch.png', sizingMethod='scale'); -ms-filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/isearch.png', sizingMethod='scale')}
/* ---------------------------------------------------------------------- */
/* HEADER
/* ---------------------------------------------------------------------- */
#header{height:86px; background-color:#fff; border-bottom:1px solid #dedede; z-index:97}
/*--[ Logo ]--*/
.garden-logo{float:left}
#logo{position:relative}
#logo .garden-logoi{display:inline-block; width:233px; height:31px; margin-top:30px; background:url(../img/logo.png) no-repeat}
#logo img{margin-top:30px}
/*--[ Main Navigation ]--*/
.garden-nav{float:right}
#main-nav li{line-height:1.2}
#main-nav a{outline:none}
/* Nav 1st */
#main-nav .nav1st-ul{position:relative; margin:0; padding:0; list-style:none}
#main-nav .nav1st-li{float:left; margin:0; padding:0; list-style:none}
#main-nav .nav1st-li a.nav1st{position:relative; display:block; height:33px; padding:26px 30px 27px; text-align:center; font-family:'Nanum Gothic', 돋움; font-size:12px; font-weight:400; border-left:1px solid #dedede; z-index:2}
#main-nav .nav1st-li:first-child a.nav1st{border-left:0}
#main-nav .nav1st-li a.nav1st .nav1st-ko{display:block; font-size:15px; font-weight:700; color:#333}
#main-nav .nav1st-li a.nav1st .nav1st-en{display:block; font-size:13px; font-weight:400; color:#9e9e9e}
#main-nav .nav1st-li.hover a.nav1st > span,
#main-nav .current a.nav1st > span{color:#3aa6d8}
#main-nav .nav1st-li.hover a.nav1st-:after{display:block; content:' '; position:absolute; bottom:-1px; left:50%; margin-left:-8px; width:0; border-style:solid; border-width:0 7px 8px; border-color:#fff transparent; z-index:1}
#main-nav .nav1st-li.hover a.nav1st-:before{display:block; content:' '; position:absolute; bottom:0px; left:50%; margin-left:-8px; width:0; border-style:solid; border-width:0 7px 8px; border-color:#c9c9c9 transparent; z-index:0}
/* Nav 2nd */
#main-nav .nav2nd-box{display:none; position:absolute; top:86px; right:0; width:880px; border-bottom:6px solid #3aa6d8; box-shadow:2px 2px 6px rgba(0,0,0,.05); z-index:1}
#main-nav .nav2nd-ul{margin:0; padding:20px 15px; background:#fff; border:1px solid #c9c9c9; border-bottom:0; list-style:none}
#main-nav .nav2nd-li{float:left; width:140px; padding:10px 15px}
#main-nav .nav2nd-li.nav2nd-img{padding-right:25px}
#main-nav .nav2nd-li a.nav2nd{display:block; padding-left:4px; font-family:'Nanum Gothic', 돋움; font-size:14px; font-weight:700; color:#555}
#main-nav .nav2nd-li a.nav2nd:hover,
#main-nav .nav2nd-li a.nav2nd:focus,
#main-nav .nav2nd-li.current a.nav2nd{color:#3aa6d8}
/* Nav 3rd */
#main-nav .nav3rd-ul{margin:10px 0 0 0; padding:11px 8px 0 4px; border-top:1px solid #e8e8e8; list-style:none}
#main-nav .nav3rd-li{position:relative; margin:0 0 8px 0; padding:0}
#main-nav .nav3rd-li a.nav3rd{display:block; padding-left:8px; background:url(../img/nav3rd.png) no-repeat left center; font-family:'Nanum Gothic', 돋움; font-size:13px; font-weight:400; color:#666}
#main-nav .nav3rd-li a.nav3rd:hover,
#main-nav .nav3rd-li a.nav3rd:focus,
#main-nav .nav3rd-li.current a.nav3rd{color:#3aa6d8}
#main-nav .nav3rd-desc a.nav3rd{display:block; line-height:1.6; font-family:'Nanum Gothic', 돋움; font-size:12px; font-weight:400; color:#888}
#main-nav .nav3rd-desc a.nav3rd:hover,
#main-nav .nav3rd-desc a.nav3rd:focus{color:#666}
/* ---------------------------------------------------------------------- */
/* PAGE TITLE, BREADCRUMB
/* ---------------------------------------------------------------------- */
#garden_title{position:relative; padding:14px 0; -moz-box-shadow:0 1px 1px rgba(0,0,0,.2); -o-box-shadow:0 1px 1px rgba(0,0,0,.2); -webkit-box-shadow:0 1px 1px rgba(0,0,0,.2); box-shadow:0 1px 1px rgba(0,0,0,.2); z-index:96}
#garden_breadcrumb ul{margin:0; padding:0; list-style:none}
#garden_breadcrumb li{float:left; margin:0 0 0 6px; padding:0; font-family:'Nanum Gothic', 돋움; font-size:13px; font-weight:400}
#garden_breadcrumb li a{color:#888}
#garden_breadcrumb li:last-child a{color:#444}
#garden_breadcrumb li.home i.fa{font-size:16px}
#garden_breadcrumb li a:hover{color:#000}
#garden_titlei{position:relative; background-repeat:no-repeat; background-position:center top; background-size:cover; border-bottom:6px solid #ebebeb; z-index:95}
#garden_titlei .garden-container{height:140px}
#garden_titlei .page-title{position:absolute; top:48%; padding:1px 33px 3px 7px; background-color:#3aa6d8}
#garden_titlei h1{display:inline-block; margin:0; padding:0; font-family:'Nanum Gothic', 돋움; font-size:27px; font-weight:400; color:#fff}
/* ---------------------------------------------------------------------- */
/* SLIDER
/* ---------------------------------------------------------------------- */
#garden_slider{clear:both; border-bottom:1px solid #dedede; z-index:94}
/* ---------------------------------------------------------------------- */
/* CONTENT
/* ---------------------------------------------------------------------- */
#contents{background-color:#f2f2f2;/* z-index:93 */}
.main #contents{padding:10px 0}
.sub #contents{padding:40px 0 10px}
/* ---------------------------------------------------------------------- */
/* FOOTER
/* ---------------------------------------------------------------------- */
#footer{height:33px; background-color:#3aa6d8; z-index:92}
/*--[ Option Navigation ]--*/
#option_nav{float:left}
#option_nav ul{margin:0; padding:0; list-style:none}
#option_nav li{float:left; height:33px; margin:0 30px 0 0; padding:0; line-height:33px; font-family:'Nanum Gothic', 돋움; font-size:13px; color:#fff}
#option_nav li a{color:#fff}
#option_nav li a:hover,
#option_nav li a:focus{color:#fff}
/*--[ Site Go ]--*/
#footer .garden-sitego{position:relative; float:right}
#footer .garden-sitego select{float:left; margin:0; padding:8px 12px 8px 12px; background:url(../img/opacity08.png); background:rgba(0,0,0,.08); border:0; border-radius:0; line-height:1.2; font-family:Arial, 돋움; font-size:12px; font-weight:normal; color:#fff; -webkit-appearance:none; cursor:pointer}
#footer .garden-sitego select option{margin:0; padding:0; background:#3aa6d8; border:0; font-family:Arial, 돋움; font-size:12px; font-weight:normal; color:#fff; -webkit-appearance:none; cursor:pointer}
#footer .garden-sitego input.goGo{float:left; width:35px; height:33px; line-height:33px; margin:0; padding:0; background:url(../img/opacity15.png); background:rgba(0,0,0,.15); border:0; border-radius:0; font-size:12px; color:#fff; cursor:pointer; -webkit-appearance:none; -webkit-transition:background-color .1s ease; -moz-transition:background-color .1s ease; -ms-transition:background-color .1s ease; -o-transition:background-color .1s ease; transition:background-color .1s ease}
#footer .garden-sitego input.goGo:hover,
#footer .garden-sitego input.goGo:focus{background:url(../img/opacity20.png); background:rgba(0,0,0,.2)}
/* ---------------------------------------------------------------------- */
/* FOOTER BOTTOM
/* ---------------------------------------------------------------------- */
#footer-bottom{background:#fff; padding-top:11px; padding-bottom:10px; z-index:91}
/*--[ Contact ]--*/
#footer-bottom .garden-contact{margin-bottom:15px}
#footer-bottom .logo_footer{float:left; margin-right:20px}
#footer-bottom .contact_infor,
#footer-bottom .contact_info{font-style:normal}
#footer-bottom .contact_info p,
#footer-bottom .contact_infor p{position:relative; margin:0; padding:3px 0; font-family:'Nanum Gothic', 돋움; line-height:1.4; font-size:12px; color:#666}
#footer-bottom .contact_info p{float:left; margin-right:20px; padding-left:20px;}
#footer-bottom .contact_info p:before{position:absolute; top:50%; left:0; display:block; font-family:FontAwesome; font-style:normal; font-weight:normal; line-height:1}
#footer-bottom .contact_info p.address:before{content:"\f015"; margin-left: -1px; margin-top:-10px; font-size:20px}
#footer-bottom .contact_info p.tel:before{content:"\f095"; margin-left: 1px; margin-top:-10px; font-size:20px}
#footer-bottom .contact_info p.fax:before{content:"\f02f"; margin-top:-9px; font-size:18px}
#footer-bottom .contact_info p.email:before{content:"\f0e0"; margin-top:-9px; font-size:17px}
#footer-bottom .contact_info p a{color:#888}
/*--[ Copyright ]--*/
#footer-bottom .copyright{margin:0; padding:0; font-family:Tahoma,Geneva,sans-serif,굴림; font-size:12px; color:#999}
/*--[ Back to Top ]--*/
#sTop, .touch-device #sTop:hover{display:none; position:fixed; bottom:30px; right:10px; height:39px; width:39px; background:url(../img/arrows.png) no-repeat scroll -78px 0 #333; background-color:rgba(0, 0, 0, .5); overflow:hidden; text-decoration:none; text-indent:-999px; z-index:999; outline:none}
#sTop:hover,
#sTop:focus{background-color:#3aa6d8}
/* ---------------------------------------------------------------------- */
/* Placeholder
/* ---------------------------------------------------------------------- */
::-webkit-input-placeholder{color:#aaa !important}
:-moz-placeholder{color:#aaa !important}
:-ms-input-placeholder{color:#aaa !important}
.text-placeholder{color:#aaa !important}
/* ---------------------------------------------------------------------- */
/* CAMERON IE HACK
/* ---------------------------------------------------------------------- */
/*--[ IE 8~11 ]--*/
@media screen\0 {
#main-nav .nav2nd-box{top:85px}
}
/*--[ IE 8 ]--*/
@media \0screen {
}
/*--[ IE 6~7 ]--*/
@media screen\9 {
#main-nav .nav2nd-box{top:86px}
#footer-bottom .contact_info p{padding-left:0}
#footer .garden-sitego select{margin-top:6px; padding:0}
#footer .garden-sitego input.goGo{width:35px; height:20px; line-height:20px; margin-top:7px}
}
/*--[ Firefox ]--*/
@-moz-document url-prefix() {
}
/* ---------------------------------------------------------------------- */
/* GARDEN WIDGET CUSTOM
/* ---------------------------------------------------------------------- */
#garden_slider .gardenSlider .bx-wrapper .bx-controls-direction{max-width:980px; left:50% !important; margin-left:-490px !important}
/* ---------------------------------------------------------------------- */
/* CAMERON XE FIX
/* ---------------------------------------------------------------------- */
/*--[ Page Fix ]--*/
#content .btnArea{margin:0 !important; padding-top:10px !important; padding-bottom:10px !important}
/*--[ Member ]--*/
.xm h1,
.xc h1{margin:0 0 20px 0; padding:0 0 20px 0; border-bottom:1px solid #efefef; font-family:'Nanum Gothic', 돋움; font-weight:700; color:#3a3a3a}
.xm .nav-tabs,
.xc .nav-tabs{border-bottom:0}
.xm .nav-tabs>li,
.xc .nav-tabs>li{margin:0 5px 5px 0; font-family:'Nanum Gothic', 돋움; font-weight:400}
.xm .nav-tabs>li>a,
.xc .nav-tabs>li>a{padding:6px 12px; background-color:#fff; border:1px solid #dadada; border-radius:0; line-height:1.2; font-size:12px; color:#888}
.xm .nav-tabs>li>a:hover,
.xc .nav-tabs>li>a:hover,
.xm .nav-tabs>.active>a,
.xm .nav-tabs>.active>a:hover,
.xc .nav-tabs>.active>a,
.xc .nav-tabs>.active>a:hover{padding-bottom:5px; background-color:#3aa6d8; border:1px solid #3aa6d8; color:#fff}
.xm .login-header h1{padding:0; border-bottom:0}
.xm .form-horizontal{margin:0; padding:10px 0}
.xm .form-horizontal .control-label{padding-top:8px; font-family:'Nanum Gothic', 돋움; font-weight:400; color:#3a3a3a}
.xm input[type="text"], .xm input[type="password"], .xm input[type="email"], .xm input[type="url"], .xm input[type="search"], .xm input[type="tel"]{padding:6px}
어느부분을 수정하면될까요 ㅜㅜ?
www.dcrete.co.kr 사이트는 이거입니다!
댓글 3
-
DoorWeb
2014.07.01 17:27
-
윤민정8549
2014.07.02 10:04
감사합니다 coorweb님!!
한가지 더여쭤봐두 될까요 ㅜㅜ?
제가 레이아웃을복사해서쓰는데 원본말고
복사한레이아웃만 배경색을 바꾸고싶은데
복사한레이아웃 들어있는 경로가 어떻게 될까요..ㅠㅠ
-
DoorWeb
2014.07.02 11:34
css 파일이름은 같을겁니다.
복사한 레이아웃에서 css 파일열고 똑같이 수정하시면 됩니다.
#contents{background-color:#f2f2f2;/* z-index:93 */}
이 부분에 배경이 걸려 있습니다.