/* BASIC css start */ #scroll-right {position: fixed; box-shadow:0 5px 15px rgba(0,0,0,0.25); z-index: 2000; top: 0; right:-292px; background: #fff; width: 250px; height: 100%; padding: 20px; border-left: solid 1px #e6e6e6; padding-top: 10px; } #scroll-right a{line-height: 23px;} .side-menu .div-wrap {display: block; margin-bottom: 30px;} .side-menu .board-btn a{display: block;} /**/ .instafeed_wrap {display:block;} .instafeed_wrap {position:relative; z-index:11; width:100%; margin:0 0 -1px; padding:0 0 10px;} .instafeed_wrap .title { position:relative; width:100%; margin:0 auto 25px; height:26px; line-height:26px; text-align:center;} .instafeed_wrap .title .tit a {font-size:12px; color:#000; letter-spacing:0.2em;} .instafeed_wrap .title .tit i {position:relative; top:3px; font-size:5px !important;} .instafeed_wrap .title .tag {position:absolute; top:25px; left:7px;} .instafeed_wrap .title a{color:#000; font-size:5px;} .instafeed_wrap .title a:hover{color:#840026; text-decoration:none;} #instafeed{ width:100%; margin:0 auto;} #instafeed .post{display:inline-block;*display:inline;*zoom:1; position:relative; width:40px; height:40px; margin:0 3px 3px 0;overflow:hidden;} #instafeed img{width:100%; transition:all .3s ease;-webkit-transition:all .3s ease;} #instafeed img:hover{filter:alpha(opacity=60);opacity:.6;-webkit-opacity:.6;} #instafeed .post .tit{display:none;position:absolute;z-index:10;bottom:-4px;left:50%;width:74px;margin-left:-37px;line-height:25px;border:1px solid #ddd;border-radius:4px;background:#f4f4f4;font-size:11px;color:#333;text-align:center;white-space:nowrap;overflow:hidden;filter:alpha(opacity=0);opacity:0;-webkit-opacity:0;transition:all .2s ease;-webkit-transition:all .2s ease;} #instafeed .post:hover .tit{bottom:0;filter:alpha(opacity=100);opacity:1.0;-webkit-opacity:1.0;} #instafeed .post .tit a:hover{text-decoration:none;} @media all and (max-width:1265px){ .instafeed_wrap .title{width:880px;}#instafeed{width:880px;} #instafeed .post{width:85px;height:85px;}} .links { overflow:hidden; margin-top:10px; margin-bottom:10px;} .links li {float:left; width:50%;} .links li i {font-size:30px;} .links li a {display: block; margin:2px; padding:10px 0; font-size:12px; border: 1px solid #eaeaea; text-align: center;} .links li a span {margin-right:5px;} .yellow {color:#ff9600;} .red {color:#ff0048;} .green {color:#1fdb00;} .blue {color:#005aff;} .asidemiddle {position:relative; margin:0 auto; width:100%; height:100%; margin-top:20px; text-align:center; padding-bottom:100px; border-bottom:1px solid #000;} .asidemiddle .bottm1 {width:50%; float:left;} .asidemiddle .bottm1 img {width:80%; } .asidemiddle .bottm2 {width:50%; float:right;} .asidemiddle .bottm2 img {width:80%;} .asidemiddle .bottm3 {margin-top:5px; width:50%; float:left;} .asidemiddle .bottm3 img {width:80%; } .asidemiddle .bottm4 {margin-top:5px; width:50%; float:right;} .asidemiddle .bottm4 img {width:80%;} .side-menu .tit {color: #242424; font-size: 13px; padding-bottom: 8px; margin-bottom: 10px; border-bottom: solid 1px #d4d4d4;} .side-menu .side-cs-center .tel {font-weight: 400; font-size: 16px; color: #000; padding-bottom: 3px;} .side-menu .side-cs-center .cont {line-height: 19px;} .side-menu .side-bank-info .cont {font-size:14px; line-height: 19px; color:#000;} #side-menu-wrap .right-btn {box-shadow:0 5px 15px rgba(0,0,0,0.25); width: 20px; height:40px; position: absolute; top: 40%; right: 290px; margin-top: -8px; cursor: pointer; border: solid 0px #840026; background: #fff; display: inline-block; padding: 15px 10px; border-radius:10%;} #side-menu-wrap .right-btn .xi { margin-top:10px; font-size: 20px; transform: rotate(0deg); color:#840026;} #side-menu-wrap .right-btn .xi.rotate {transform: rotate(180deg); padding-left: 3px;} .tagshop {position:relative; width:100%; margin:30px auto; text-align:left; padding-left:10px; padding-bottom:20px; background:#F6F6F6;} .tagshop .tagtit a {font-size:16px; color:#000;} .tagshop li {padding-top:10px;} .tagshop li a { font-size:14px;} /*나눔고딕 폰트설정 시작*/ /*400 Regular*/ @font-face { font-family: 'Nanum Gothic'; font-style: normal; font-weight: 400; src: url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Regular.eot); src: url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Regular.eot?#iefix) format('embedded-opentype'), url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Regular.woff2) format('woff2'), url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Regular.woff) format('woff'), url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Regular.ttf) format('truetype');} /*700 Bold*/ @font-face {font-family: 'Nanum GothicB'; font-style: normal; font-weight: 700; src: url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Bold.eot); src: url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Bold.eot?#iefix) format('embedded-opentype'), url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Bold.woff2) format('woff2'), url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Bold.woff) format('woff'), url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Bold.ttf) format('truetype');} /*800 Extrabold*/ @font-face { font-family: 'Nanum GothicEB'; font-style: normal; font-weight: 800; src: url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-ExtraBold.eot); src: url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-ExtraBold.eot?#iefix) format('embedded-opentype'), url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-ExtraBold.woff2) format('woff2'), url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-ExtraBold.woff) format('woff'), url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-ExtraBold.ttf) format('truetype');} /*나눔고딕 폰트설정 끝*/ /*본고딕 폰트설정 시작*/ @font-face { font-family: 'Noto Sans'; font-style: normal; font-weight: 400; src: local('Noto Sans'), local('NotoSans'), url(https://fonts.gstatic.com/s/notosans/v6/LeFlHvsZjXu2c3ZRgBq9nD8E0i7KZn-EPnyo3HZu7kw.woff) format('woff'); } /*나눔고딕 폰트설정 시작*/ /*400 Regular*/ @font-face { font-family: 'Nanum Gothic'; font-style: normal; font-weight: 400; src: url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Regular.eot); src: url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Regular.eot?#iefix) format('embedded-opentype'), url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Regular.woff2) format('woff2'), url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Regular.woff) format('woff'), url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Regular.ttf) format('truetype');} /*700 Bold*/ @font-face {font-family: 'Nanum GothicB'; font-style: normal; font-weight: 700; src: url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Bold.eot); src: url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Bold.eot?#iefix) format('embedded-opentype'), url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Bold.woff2) format('woff2'), url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Bold.woff) format('woff'), url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Bold.ttf) format('truetype');} /*800 Extrabold*/ @font-face { font-family: 'Nanum GothicEB'; font-style: normal; font-weight: 800; src: url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-ExtraBold.eot); src: url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-ExtraBold.eot?#iefix) format('embedded-opentype'), url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-ExtraBold.woff2) format('woff2'), url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-ExtraBold.woff) format('woff'), url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-ExtraBold.ttf) format('truetype');} /*나눔고딕 폰트설정 끝*/ /*본고딕 폰트설정 시작*/ @font-face { font-family: 'Noto Sans'; font-style: normal; font-weight: 400; src: local('Noto Sans'), local('NotoSans'), url(https://fonts.gstatic.com/s/notosans/v6/LeFlHvsZjXu2c3ZRgBq9nD8E0i7KZn-EPnyo3HZu7kw.woff) format('woff'); } #hdWrap {width:100%; min-width:1200px; height:auto; margin:0 auto;} #hdWrap .hdArea {position: fixed; top: 0; width:100%; height:40px; background-color: #ea0202; z-index:200; } /* hdArea */ .hdArea .subname { position: absolute; top: 10px; left:0x; } .hdArea .subname a {font-size:13px; font-weight:300; color:#fff;} .hdArea .subname a span {font-size:13px; font-weight:500; color:#fff;} .hdArea .search { position: absolute; top: 2px; left: 250px; width: 160px; height: 29px; padding: 0px 29px 0 5px; border-bottom: 1px solid #fff; } .hdArea .search .MS_search_word, .hdArea .search .btn-sch { float: left; width: auto;background:#ea0202; color:#fff; } .hdArea .search .btn-sch { position: absolute; top: 5px; right: 9px; } .hdArea .search .MS_search_word { width: 100%; height: 29px; line-height: 29px; border: 0 none; } .hdArea .search a {height:30px; line-height:30px; background:#840026;} .hdArea .mlnk > li dl {width:100px; display: none; position: absolute; top: 40px; zoom: 1; overflow: hidden; padding: 10px 0; border: 1px solid #bebebe; background: #fff; text-align: left; z-index:100;} .hdArea .mlnk > li dl dd { min-width: 30px; } .hdArea .mlnk > li dl dd a { display: block; padding: 0 10px 0 10px; line-height: 24px; } .hdArea .mlnk > li dl dd a:hover { background: #840026; color: #fff; } #hdWrap .hdArea .mlnk #smlogo { position:absolute; right:580px; top:-34px; margin:0 auto;} #hdWrap .hdArea .mlnk a #smlogo img{ height:30px; } #hdWrap .scroll img {margin:34px 0 0 0;transition:1s;} .hdArea div { position:relative; width:1265px; margin:0 auto;} .hdArea .mlnk { position: absolute; top: 0; right: 0; zoom: 1; } .hdArea .mlnk:after { content: ''; display: block; clear: both; } .hdArea .mlnk li { float: left; position: relative; width: auto; margin-right: 25px;} .hdArea .mlnk li a {font-size:12px; color: #fff; line-height: 40px;} .hdArea .mlnk .cs {color:#000;} .hdArea .mlnk li a:hover { color: #fff;} .hdArea .mlnk li .tooltip { position: absolute; top: 35px; left: 50%; margin-left: -30px; width: 70px; height: 20px; line-height: 19px; border-radius: 9px; background: #e80043; color: #fff; text-align: center; z-index:100; } .hdArea .mlnk li .tooltip span { content: ""; position: absolute; top: -4px; left: 50%; display: block; margin-left: -4px; border-bottom: 4px solid #e80043; border-right: 4px solid transparent; border-left: 4px solid transparent; } /* header */ #header { z-index: 1; position: relative; width:1265px; margin:auto; height: 165px; text-align:center; vertical-align:center; } /* aside */ #header .bi { z-index:21; text-align: center; padding-top: 60px; } #header .bi img{width: 256px; height:96px; } #header .left { position:absolute; top:70px; left:0px; width:300px; height:80px;} #header .header-slide {overflow:visible!important;} #header .header-slide .slidesjs-navigation {position:absolute; bottom:0; height:14px; text-indent:-9999px; background:url(/design/freevent/topslide_arrow.png) no-repeat; border:1px solid #BDBDBD; } #header .header-slide .slidesjs-navigation:hover {border-color:#840026; z-index:1;} #header .header-slide .slidesjs-previous {right:-34px; width:14px; border-radius:2px 0 0 2px; background-position:5px 50%;} #header .header-slide .slidesjs-next {right:-48px; width:13px; border-radius:0 2px 2px 0; background-position:-9px 50%;} #header .right { position:absolute; top:85px; right:0px; width:200px; height:64px;} #header .header-slide1 {overflow:visible!important;} /*#header .header-slide1 img {border-radius:100%;}*/ #header .header-slide1 .slidesjs-navigation {position:absolute; top:0; height:14px; text-indent:-9999px; background:url(/design/freevent/topslide_arrow.png) no-repeat; border:1px solid #BDBDBD; } #header .header-slide1 .slidesjs-navigation:hover {border-color:#840026; z-index:1;} #header .header-slide1 .slidesjs-previous {left:-34px; width:14px; border-radius:2px 0 0 2px; background-position:5px 50%;} #header .header-slide1 .slidesjs-next {left:-20px; width:13px; border-radius:0 2px 2px 0; background-position:-9px 50%;} /* gnbArea */ .gnbArea { position: fixed; width:100%; height:45px; background-color: #fff; z-index:150; box-shadow:0 2px 2px rgba(0,0,0,0.2);} .gnbArea .gnb { zoom: 1; width: 1500px; margin:0 auto; text-align:center; } .gnbArea .gnb:after { content: ''; display: block; clear: both; } .gnbArea .gnb > li {position: relative; display: inline-block; padding:0 25px;} .gnbArea .gnb > li > a {color:#000; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 45px; font-size: 14px; font-weight:400; } .gnbArea .gnb > li > a:hover { color:#840026; } .gnbArea .gnb > li:hover a.gnbTit {color: #000; } .gnbArea .gnb > li dl { display: none; position: absolute; top: 45px; zoom: 1; overflow: hidden; padding: 10px 0; border:1px solid #bebebe; border-top:0px; opacity:1; background: #fff; text-align: left;} .gnbArea .gnb > li dl dd {padding-top:10px; width:150px; min-width: 150px; } .gnbArea .gnb > li dl dd a {font-size: 14px; font-weight:300; color:#000; display: block; padding: 0 10px 0 25px; line-height: 24px;text-overflow: ellipsis; white-space: nowrap; } .gnbArea .gnb > li dl dd a:hover {color: #ff0000; } /*베스트*/ .gnbArea .gnb li.menu2 { position:relative; float:left; padding:0 25px;} .gnbArea .gnb li.menu2 a { font-size:16px; color:#ff0000 ; display:block; text-transform:uppercase; } .gnbArea .gnb li.menu2 a: hover {color:#000;} .gnbArea .gnb li.menu2 dl {} .gnbArea .gnb li.menu2 dl dd {padding-top:10px; width:110%; } .gnbArea .gnb li.menu2 dl dd a {font-size: 14px; font-weight:300; color:#000 ; display: block; padding: 0 10px 0 25px; line-height: 24px;text-overflow: ellipsis; white-space: nowrap; } .gnbArea .gnb li.menu2 dl dd a:hover {color:#ff0000 ; } .gnbArea .gnb li.menu3 { position:relative; padding:0 25px;} .gnbArea .gnb li.menu3 a { font-size:14px; color:#000 ; display:block; text-transform:uppercase; } .gnbArea .gnb li.menu3 a: hover {color:#000;} .gnbArea .gnb li.menu3 dl {} .gnbArea .gnb li.menu3 dl dd {padding-top:10px; width:110%; } .gnbArea .gnb li.menu3 dl dd a {font-size: 14px; font-weight:300; color:#000 ; display: block; padding: 0 10px 0 25px; line-height: 24px;text-overflow: ellipsis; white-space: nowrap; } .gnbArea .gnb li.menu3 dl dd a:hover {color:#ff0000 ; } .gnbArea .gnb li.menu1 { position:relative; float:left; padding:0 25px;} .gnbArea .gnb li.menu1 a { font-size:14px; color:#ff0000 ; display:block; text-transform:uppercase; } .gnbArea .gnb li.menu1 a: hover {color:#000;} .gnbArea .gnb li.menu1 dl {} .gnbArea .gnb li.menu1 dl dd {padding-top:10px; width:400px; } .gnbArea .gnb li.menu1 dl dd a {font-size: 14px; font-weight:300; color:#000 ; display: block; padding: 0 10px 0 25px; line-height: 24px;text-overflow: ellipsis; white-space: nowrap; } .gnbArea .gnb li.menu1 dl dd a:hover {color:#ff0000 ; } /* BASIC css end */