/*버튼*/ .main_btn_white { width:175px; height:50px; border:1px solid #fff; text-align:center; font-size:12px; color:#fff; font-family: 'Roboto', 'NotoSans', sans-serif; line-height:50px; font-weight:500; letter-spacing:2px; cursor: pointer; display:inline-block; -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0); box-shadow: 0 0 1px transparent; position: relative; -webkit-transition-property: color; transition-property: color; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; } .main_btn_white:before { content: ""; position: absolute; z-index:-1; top:0; bottom:0; left:0; right:0; background-color:#fff; color:#000; -webkit-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: 0%; transform-origin: 0%; -webkit-transition-property: transform; transition-property: transform; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; } .main_btn_white:hover:before, .main_btn_white:focus:before, .main_btn_white:active:before { -webkit-transform: scaleX(1); transform: scaleX(1); } .main_btn_white:hover {color:#000;} .main_btn_black { width:175px; height:50px; border:1px solid #c2c1c1; text-align:center; font-size:12px; color:#777; font-family: 'Roboto', sans-serif; line-height:50px; font-weight:500; letter-spacing:2px; cursor: pointer; display:inline-block; -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0); box-shadow: 0 0 1px transparent; position: relative; -webkit-transition-property: color; transition-property: color; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; } .main_btn_black:before { content: ""; position: absolute; z-index:-1; top:0; bottom:0; left:0; right:0; background-color:#ff7800; border:1px solid #ff7800; -webkit-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: 0%; transform-origin: 0%; -webkit-transition-property: transform; transition-property: transform; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; } .main_btn_black:hover:before, .main_btn_white:focus:before, .main_btn_white:active:before { -webkit-transform: scaleX(1); transform: scaleX(1); } .main_btn_black:hover {color:#fff;} .head_main a { color:#ffffff; } .mobile_main_btn_black { display:none; } @media all and (min-width: 1500px) { #head {width:100%; height:110px; position:absolute; top:0; z-index:100; } /*#head {width:100%; height:110px; position:fixed; top:0; z-index:100001; }*/ #head ul {margin:0 auto; padding:0 40px;} #head .logo {float:left; width:280px;} #head .logo img {width:80px; padding-top:15px;} #head .menu {float:left; width:calc(100% - 560px);} #head .menu .area {width:1000px; margin:0 auto;} #head .menu .area div { float:left; width:20%; text-align:center; font-family: 'anton'; font-size:19px; color:#fff; line-height:110px; font-weight:300; text-transform:uppercase; letter-spacing:1px; cursor: pointer; } #head .menu .area div:hover {color:#ff7800;} #head .lan {float:left; width:280px; text-align:right; line-height:110px; } .lan a {margin-left:13px; color:#555555; font-size:15px; font-weight:900; padding:5px 0;} .head_main ul li.lan a { color:#ffffff; } #head .lan a:hover {color:#ff7800; border-top:2px solid #ff7800;} #head .lan .on {color:#ff7800 !important; border-top:2px solid #ff7800;} #head_over {width:100%; height:0px; overflow:hidden; position:absolute; top:109px; z-index:100000; background:url('../../sub/img/head_over_bg.png') repeat;} /*#head_over {width:100%; height:0px; overflow:hidden; position:fixed; top:109px; z-index:100000; background:url('../../sub/img/head_over_bg.png') repeat;}*/ #head_over ul {width:1000px; height:250px; margin:0 auto; } #head_over li {float:left; width:20%; height:250px; padding:20px; text-align:center; font-size:16px; line-height:38px; font-weight:700;} #head_over li:hover {color:#fff; background-color:#ff7800;} #head_over li a {color:#555;} #head_over li a:hover {color:#ff7800;} #head_blank {width:100%; height:110px;} #sec_01 {width:100%; overflow:hidden; padding:100px 0;} #sec_01 .main_title {text-align:center;} #sec_01 .main_title p {font-size:40px; color:#3c3f3f; font-family: 'Roboto', sans-serif; font-weight:900; letter-spacing:2px; padding:40px 0; text-transform:uppercase; } #sec_01 .main_title p span {color:#ff7800;} #sec_01 .main_text {text-align:center; font-size:18px; color:#777; line-height:32px; letter-spacing:-1px;} #sec_01 .icon {width:760px; margin:0 auto; padding-top:50px;} #sec_01 .icon li { position:relative; float:left; width:25%; text-align:center;} #sec_01 .icon li a { position:absolute; top:0; left:0; display:block; width:100%; height:100%; } #sec_01 .icon li img { display:block; width:120px; margin:0 auto; } #sec_01 .icon li p {color:#3c3f3f; font-size:17px; font-weight:700; padding-top:15px;} #sec_01 .icon .sample {width:100px; height:100px; background-color:#ddd; margin:0 auto; border-radius:100px;} } @media all and (max-width: 1499px) { #head {width:100%; height:110px; position:absolute; top:0; z-index:100001; } /*#head {width:100%; height:110px; min-width:1200px; position:fixed; top:0; z-index:100000;}*/ #head ul {margin:0 auto; padding:0 40px;} #head .logo {float:left; width:150px;} #head .logo img {width:80px; padding-top:15px;} #head .menu {float:left; width:calc(100% - 300px);} #head .menu .area {width:860px; margin:0 auto;} #head .menu .area div { float:left; width:20%; text-align:center; font-family: 'anton'; font-size:19px; color:#fff; line-height:110px; font-weight:300; text-transform:uppercase; letter-spacing:1px; cursor: pointer; } #head .menu .area div:hover {color:#ff7800;} #head .lan {float:left; width:150px; text-align:right; line-height:110px;} #head .lan a {margin-left:10px; color:#a3a3a3; font-size:14px; font-weight:900; padding:5px 0;} #head .lan a:hover {color:#ff7800; border-top:2px solid #ff7800;} #head .lan .on {color:#ff7800; border-top:2px solid #ff7800;} #head_over {width:100%; height:0px; overflow:hidden; min-width:1240px; position:absolute; top:109px; z-index:100000001; background:url('../../sub/img/head_over_bg.png') repeat;} /*#head_over {width:100%; height:0px; overflow:hidden; min-width:1240px; position:fixed; top:109px; z-index:100000001; background:url('../../sub/img/head_over_bg.png') repeat;}*/ #head_over ul {width:860px; height:250px; margin:0 auto;} #head_over li {float:left; width:20%; height:250px; padding:20px; text-align:center; font-size:16px; line-height:38px; font-weight:700;} #head_over li:hover {background-color:#fff;} #head_over li a {color:#555;} #head_over li a:hover {color:#fff; background-color:#ff7800;} #head_blank {width:100%; height:110px;} } @media all and (min-width: 1500px) { #main {width:100%; height:900px; background-color:#000; overflow:hidden;} #main .main_01 {width:100%; height:900px; background:url('../../sub/img/main_001.jpg') center no-repeat; background-size:105px;} #main .main_02 {width:100%; height:900px; background:url('../../sub/img/main_002.jpg') center no-repeat; background-size:105px;} #sec_01 {width:100%; overflow:hidden; padding:100px 0;} #sec_01 .main_title {text-align:center;} #sec_01 .main_title p {font-size:40px; color:#3c3f3f; font-family: 'Roboto', sans-serif; font-weight:900; letter-spacing:2px; padding:40px 0;} #sec_01 .main_title p span {color:#ff7800;} #sec_01 .main_text {text-align:center; font-size:18px; color:#777; line-height:32px; letter-spacing:-1px;} #sec_01 .icon {width:760px; margin:0 auto; padding-top:50px;} #sec_01 .icon li { position:relative; float:left; width:25%; text-align:center;} #sec_01 .icon li a { position:absolute; top:0; left:0; display:block; width:100%; height:100%; } #sec_01 .icon img {width:100px;} #sec_01 .icon li p {color:#3c3f3f; font-size:17px; font-weight:700; padding-top:15px;} #sec_01 .icon .sample {width:100px; height:100px; background-color:#ddd; margin:0 auto; border-radius:100px;} #banner_01_bg {width:100%; height:385px; background:url('../../sub/img/banner_01_bg.jpg') center no-repeat; background-size:cover; position:absolute; z-index:-2; top:1620px;} #banner_01_text {width:1300px; height:385px; overflow:hidden; margin:0 auto; font-family: 'NanumSquare', sans-serif; font-size:20px; color:#fff; padding-top:75px;} #banner_01_text p {font-size:50px; font-family: 'Roboto', sans-serif; color:#fff; line-height:55px; font-weight:100; letter-spacing:2px; padding-bottom:20px;} #banner_01_text p b {color:#ffe35f;} #banner_01_text .blank_area {height:40px;} #banner_01_img {width:640px; height:760px; background:url('../../sub/img/banner_cha_01.png') center no-repeat; background-size:cover; position:absolute; top:0; margin-top:1970px; left:50%; margin-left:140px; z-index:-1;} #banner_01_img_blank {width:100%; height:300px; background-color:#fff; position:absolute; z-index:0; top:2000px;} #main_webtoon {width:100%; overflow:hidden; padding:100px 0 230px 0; background-color:#e9e9e9; position:relative; z-index:1;} #main_webtoon ul {width:1430px; margin:0 auto;} #main_webtoon .main_title {text-align:center;} #main_webtoon .main_title p {font-size:40px; color:#3c3f3f; font-family: 'Roboto', sans-serif; font-weight:900; letter-spacing:2px; padding:40px 0;} #main_webtoon .main_title p span {color:#ff7800;} #main_webtoon .sum {width:100px; height:660px;} #main_webtoon .sum .text {padding:8px 15px 18px 15px; text-align:left; font-size:13px; color:#b9b9b9; line-height:27px; background-color:#111;} #main_webtoon .sum .text p { display:block; overflow:hidden; width:100%; text-overflow:ellipsis; white-space:nowrap; color:#fff; font-size:19px; font-weight:700;} #main_webtoon .sum .text span { display:block; overflow:hidden; width:100%; font-size:12px; text-overflow:ellipsis; white-space:nowrap; } #main_webtoon .sum .over {display:none; background:url('../../sub/img/main_webtoon_bg.png'); width:100%; height:100%; text-align:center;} #main_webtoon .sum .long {line-height:550px;} #main_webtoon .sum .short {line-height:220px;} #main_webtoon .sum .sec_01 {position:absolute; width:230px; height:660px; background-color:#111; } #main_webtoon .sum .sec_01 .img {width:230px; height:580px; border:15px solid #111;} #main_webtoon .sum .sec_02 {position:absolute; width:230px; height:325px; background-color:#111; margin-left:240px;} #main_webtoon .sum .sec_02 .img {width:230px; height:245px; border:15px solid #111;} #main_webtoon .sum .sec_03 {position:absolute; width:230px; height:325px; background-color:#111; margin-left:480px;} #main_webtoon .sum .sec_03 .img {width:230px; height:245px; border:15px solid #111;} #main_webtoon .sum .sec_04 {position:absolute; width:230px; height:325px; background-color:#111; margin-left:720px;} #main_webtoon .sum .sec_04 .img {width:230px; height:245px; border:15px solid #111;} #main_webtoon .sum .sec_05 {position:absolute; width:470px; height:325px; background-color:#111; margin-left:240px; margin-top:335px;} #main_webtoon .sum .sec_05 .img {width:470px; height:245px; border:15px solid #111;} #main_webtoon .sum .sec_06 {position:absolute; width:230px; height:325px; background-color:#111; margin-left:720px; margin-top:335px;} #main_webtoon .sum .sec_06 .img {width:230px; height:245px; border:15px solid #111;} #main_webtoon .sum .sec_07 {position:absolute; width:230px; height:660px; background-color:#111; margin-left:960px;} #main_webtoon .sum .sec_07 .img {width:230px; height:580px; border:15px solid #111;} #main_webtoon .sum .sec_08 {position:absolute; width:230px; height:325px; background-color:#111; margin-left:1200px;} #main_webtoon .sum .sec_08 .img {width:230px; height:245px; border:15px solid #111;} #main_webtoon .sum .sec_09 {position:absolute; width:230px; height:325px; background-color:#111; margin-left:1200px; margin-top:335px;} #main_webtoon .sum .sec_09 .img {width:230px; height:245px; border:15px solid #111;} #banner_02_bg {width:100%; height:395px; background:url('../../sub/img/banner_02_bg.jpg') center no-repeat; background-size:cover; position:absolute; z-index:-2; top:3200px;} #banner_02_img {width:670px; height:700px; background:url('../../sub/img/banner_cha_02.png') center no-repeat; background-size:cover; position:absolute; top:0; margin-top:3700px; left:50%; margin-left:-760px; z-index:1;} #banner_02_img_blank {width:100%; height:300px; background-color:#fff; position:absolute; z-index:2; top:3595px;} #banner_02_text {width:1300px; height:385px; overflow:hidden; margin:0 auto; font-family: 'NanumSquare', sans-serif; font-size:20px; color:#fff; padding-top:65px; text-align:right;} #banner_02_text p {font-size:50px; font-family: 'Roboto', sans-serif; color:#fff; line-height:55px; font-weight:100; letter-spacing:2px; padding-bottom:20px;} #banner_02_text p b {color:#ffe35f;} #banner_02_text .blank_area {height:40px;} #news {width:100%; background-color:#fff; position:relative; z-index:3; overflow:hidden; padding:100px 0;} #news ul {width:1430px; margin:0 auto;} #news .main_title {float:left; width:180px; margin-right:130px; font-size:17px; color:#777; line-height:27px; font-weight:700; white-space:normal; word-break:keep-all; } #news .main_title p {font-size:40px; color:#3c3f3f; font-family: 'Roboto', sans-serif; font-weight:900; letter-spacing:2px; padding:40px 0; line-height:45px;} #news .main_title p img {margin-left:5px;} #news .main_title p span {color:#ff7800;} #news .contents {float:left; width:1120px;} #news .contents .list .contents_photo { float:left; width:190px; height:130px; margin:0 35px; background:#eaeaea; } #news .contents .list .contents_photo img { width:190px; height:130px; } #news .contents .list .contents_txt { float:left; width:830px; } #news .contents .list .contents_txt img { margin:0 0 0 10px; } #news .contents .list {overflow:hidden; font-size:15px; line-height:27px; color:#999; border-bottom:1px solid #e3e3e3; padding-bottom:27px; margin-bottom:35px; white-space:normal; word-break:keep-all; } #news .contents .list span { display:block; padding:6px 0; color:#999; } #news .contents .list span.date { font-size:15px; letter-spacing:0.5px; font-weight:600; } #news .contents .list p {color:#222; font-size:20px; font-family: 'NanumSquare', sans-serif; font-weight:900; margin:8px 0 0 0; } #tail { width:100%; height:90px; overflow:hidden; background-color:#333333; padding:20px 0; word-break:keep-all; } #tail ul {padding:0 40px;} #tail .info { float:left; height:90px; font-family: 'NotoSans'; padding:0 0 20px 0; border-bottom:0px solid #444; line-height:180%; font-size:12px; color:#8d8d8d; font-weight:700; text-align:center; } #tail .info .info_img { float:left; width:45px; padding-top:15px;} #tail .info .info_img img{width:130%; } #tail .info .info_txt { float:left; margin:10px 0 0 20px; text-align:left;} #tail .info span { display:inline-block; margin:0 6px; } #tail .info a { color:#8d8d8d; } #tail .info img { display:block; } #tail .copy { float:right; line-height:50px; font-size:12px; color:#8d8d8d; font-weight:700; margin:0 6px; text-align:left; } #tail .copy div{float:left;} #tail .copy div:nth-of-type(1){padding-right:10px;} #tail .copy div:nth-of-type(1) img{padding-right:5px;} } @media only screen and (min-width: 1300px) and (max-width: 1499px){ #main {width:100%; height:900px; background-color:#000; overflow:hidden;} #main .main_01 {width:100%; height:900px; background:url('../../sub/img/main_001.jpg') center no-repeat; background-size:105px;} #main .main_02 {width:100%; height:900px; background:url('../../sub/img/main_002.jpg') center no-repeat; background-size:105px;} #sec_01 {width:100%; overflow:hidden; padding:100px 0;} #sec_01 .main_title {text-align:center;} #sec_01 .main_title p {font-size:40px; color:#3c3f3f; font-family: 'Roboto', sans-serif; font-weight:900; letter-spacing:2px; padding:40px 0; text-transform:uppercase;} #sec_01 .main_title p span {color:#ff7800;} #sec_01 .main_text {text-align:center; font-size:18px; color:#777; line-height:32px; letter-spacing:-1px;} #sec_01 .icon {width:760px; margin:0 auto; padding-top:50px;} #sec_01 .icon li { position:relative; float:left; width:25%; text-align:center;} #sec_01 .icon li a { position:absolute; top:0; left:0; display:block; width:100%; height:100%; } #sec_01 .icon img {width:100px;} #sec_01 .icon li p {color:#3c3f3f; font-size:17px; font-weight:700; padding-top:15px;} #sec_01 .icon .sample {width:100px; height:100px; background-color:#ddd; margin:0 auto; border-radius:100px;} #banner_01_bg {width:100%; height:385px; background:url('../../sub/img/banner_01_bg.jpg') center no-repeat; background-size:cover; position:absolute; z-index:-2; top:1620px;} #banner_01_text {width:1200px; height:385px; overflow:hidden; margin:0 auto; font-family: 'NanumSquare', sans-serif; font-size:20px; color:#fff; padding-top:75px;} #banner_01_text p {font-size:50px; font-family: 'Roboto', sans-serif; color:#fff; line-height:55px; font-weight:100; letter-spacing:2px; padding-bottom:20px;} #banner_01_text p b {color:#ffe35f;} #banner_01_text .blank_area {height:40px;} #banner_01_img {width:640px; height:760px; background:url('../../sub/img/banner_cha_01.png') center no-repeat; background-size:cover; position:absolute; top:0; margin-top:2000px; right:0; margin-left:190px; z-index:-1;} #banner_01_img_blank {width:100%; height:300px; background-color:#fff; position:absolute; z-index:0; top:2000px;} #main_webtoon {width:100%; overflow:hidden; padding:100px 0 200px 0; background-color:#e9e9e9; position:relative; z-index:1;} #main_webtoon ul {width:1200px; margin:0 auto;} #main_webtoon .main_title {text-align:center;} #main_webtoon .main_title p {font-size:40px; color:#3c3f3f; font-family: 'Roboto', sans-serif; font-weight:900; letter-spacing:2px; padding:40px 0;} #main_webtoon .main_title p span {color:#ff7800;} #main_webtoon .sum {width:100px; height:660px;} #main_webtoon .sum .text {padding:8px 15px 18px 15px; text-align:left; font-size:13px; color:#b9b9b9; line-height:27px; background-color:#111;} #main_webtoon .sum .text p { display:block; overflow:hidden; width:100%; text-overflow:ellipsis; white-space:nowrap; color:#fff; font-size:17px; font-weight:700;} #main_webtoon .sum .text span { display:block; overflow:hidden; width:100%; font-size:12px; text-overflow:ellipsis; white-space:nowrap; } #main_webtoon .sum .over {display:none; background:url('../../sub/img/main_webtoon_bg.png'); width:100%; height:100%; text-align:center;} #main_webtoon .sum .long {line-height:550px;} #main_webtoon .sum .short {line-height:220px;} #main_webtoon .sum .sec_01 {position:absolute; width:191px; height:660px; background-color:#111; } #main_webtoon .sum .sec_01 .img {width:191px; height:580px; border:15px solid #111;} #main_webtoon .sum .sec_02 {position:absolute; width:191px; height:325px; background-color:#111; margin-left:201px;} #main_webtoon .sum .sec_02 .img {width:191px; height:245px; border:15px solid #111;} #main_webtoon .sum .sec_03 {position:absolute; width:191px; height:325px; background-color:#111; margin-left:402px;} #main_webtoon .sum .sec_03 .img {width:191px; height:245px; border:15px solid #111;} #main_webtoon .sum .sec_04 {position:absolute; width:191px; height:325px; background-color:#111; margin-left:603px;} #main_webtoon .sum .sec_04 .img {width:191px; height:245px; border:15px solid #111;} #main_webtoon .sum .sec_05 {position:absolute; width:392px; height:325px; background-color:#111; margin-left:201px; margin-top:335px;} #main_webtoon .sum .sec_05 .img {width:392px; height:245px; border:15px solid #111;} #main_webtoon .sum .sec_06 {position:absolute; width:191px; height:325px; background-color:#111; margin-left:603px; margin-top:335px;} #main_webtoon .sum .sec_06 .img {width:191px; height:245px; border:15px solid #111;} #main_webtoon .sum .sec_07 {position:absolute; width:191px; height:660px; background-color:#111; margin-left:804px;} #main_webtoon .sum .sec_07 .img {width:191px; height:580px; border:15px solid #111;} #main_webtoon .sum .sec_08 {position:absolute; width:191px; height:325px; background-color:#111; margin-left:1005px;} #main_webtoon .sum .sec_08 .img {width:191px; height:245px; border:15px solid #111;} #main_webtoon .sum .sec_09 {position:absolute; width:191px; height:325px; background-color:#111; margin-left:1005px; margin-top:335px;} #main_webtoon .sum .sec_09 .img {width:191px; height:245px; border:15px solid #111;} #banner_02_bg {width:100%; height:395px; background:url('../../sub/img/banner_02_bg.jpg') center no-repeat; background-size:cover; position:absolute; z-index:-2; top:3150px;} #banner_02_img {width:670px; height:700px; background:url('../../sub/img/banner_cha_02.png') center no-repeat; background-size:cover; position:absolute; top:0; margin-top:3600px; left:50%; margin-left:-700px; z-index:1;} #banner_02_img_blank {width:100%; height:300px; background-color:#fff; position:absolute; z-index:2; top:3545px;} #banner_02_text {width:1200px; height:385px; overflow:hidden; margin:0 auto; font-family: 'NanumSquare', sans-serif; font-size:20px; color:#fff; padding-top:65px; text-align:right;} #banner_02_text p {font-size:50px; font-family: 'Roboto', sans-serif; color:#fff; line-height:55px; font-weight:100; letter-spacing:2px; padding-bottom:20px;} #banner_02_text p b {color:#ffe35f;} #banner_02_text .blank_area {height:40px;} #news {width:100%; background-color:#fff; position:relative; z-index:3; overflow:hidden; padding:100px 0 60px 0;} #news ul {width:1200px; margin:0 auto;} #news .main_title {float:left; width:180px; margin-right:90px; font-size:17px; color:#777; line-height:27px; font-weight:700; white-space:normal; word-break:keep-all; } #news .main_title p {font-size:40px; color:#3c3f3f; font-family: 'Roboto', sans-serif; font-weight:900; letter-spacing:2px; padding:40px 0; line-height:45px;} #news .main_title p img {margin-left:5px;} #news .main_title p span {color:#ff7800;} #news .contents {float:left; width:930px;} #news .contents .list .contents_photo { float:left; width:190px; height:130px; margin:0 35px; background:#eaeaea; } #news .contents .list .contents_photo img { width:100%; height:100%; } #news .contents .list .contents_txt { float:left; width:670px; } #news .contents .list .contents_txt img { margin:0 0 0 10px; } #news .contents .list {overflow:hidden; font-size:15px; line-height:27px; color:#999; border-bottom:1px solid #e3e3e3; padding-bottom:35px; margin-bottom:35px; white-space:normal; word-break:keep-all; } #news .contents .list span { display:block; padding:6px 0; height:58px; overflow:hidden; } #news .contents .list span.date { height:28px; margin:0 0 2px 0; } #news .contents .list p {color:#222; font-size:20px; font-family: 'NanumSquare', sans-serif; font-weight:900; margin:8px 0 0 0; } #tail { width:100%; height:auto; overflow:hidden; background-color:#333333; padding:34px 0 20px 0; word-break:keep-all; } #tail ul {padding:0 40px;} #tail .info { overflow:hidden; width:100%; height:auto; padding:0 0 20px 0; border-bottom:1px solid #444; line-height:180%; font-size:12px; color:#8d8d8d; font-weight:700; text-align:center;} #tail .info span { display:inline-block; margin:0 6px; } #tail .info_img{ width:45px; margin:0 auto 20px; } #tail .info a { color:#8d8d8d; } #tail .info img { display:block; margin:0px auto 5px; width:100%; } #tail .copy {width:100%; height:80px; line-height:50px; font-size:12px; color:#8d8d8d; font-weight:700; margin:0 6px; text-align:center; } #tail .copy div{height:40px;} #tail .copy div:nth-of-type(1) img{padding:5px 3px 0;} } @media only screen and (min-width: 1024px) and (max-width: 1299px){ #main {width:100%; height:800px; background-color:#000; overflow:hidden;} #main .main_01 {width:100%; height:800px; background:url('../../sub/img/main_001.jpg') center no-repeat; background-size:105px;} #main .main_02 {width:100%; height:800px; background:url('../../sub/img/main_002.jpg') center no-repeat; background-size:105px;} #sec_01 {width:100%; overflow:hidden; padding:100px 0;} #sec_01 .main_title {text-align:center;} #sec_01 .main_title p {font-size:40px; color:#3c3f3f; font-family: 'Roboto', sans-serif; font-weight:900; letter-spacing:2px; padding:40px 0; text-transform:uppercase;} #sec_01 .main_title p span {color:#ff7800;} #sec_01 .main_text {text-align:center; font-size:18px; color:#777; line-height:32px; letter-spacing:-1px;} #sec_01 .icon {width:760px; margin:0 auto; padding-top:50px;} #sec_01 .icon li { position:relative; float:left; width:25%; text-align:center; } #sec_01 .icon li a { position:absolute; top:0; left:0; display:block; width:100%; height:100%; } #sec_01 .icon img {width:100px;} #sec_01 .icon li p {color:#3c3f3f; font-size:17px; font-weight:700; padding-top:15px;} #sec_01 .icon .sample {width:100px; height:100px; background-color:#ddd; margin:0 auto; border-radius:100px;} #banner_01_bg {width:100%; height:385px; background:url('../../sub/img/banner_01_bg.jpg') center no-repeat; background-size:cover; position:absolute; z-index:-2; top:1510px;} #banner_01_text {width:1000px; height:385px; overflow:hidden; margin:0 auto; font-family: 'NanumSquare', sans-serif; font-size:20px; color:#fff; padding-top:75px;} #banner_01_text p {font-size:50px; font-family: 'Roboto', sans-serif; color:#fff; line-height:55px; font-weight:100; letter-spacing:2px; padding-bottom:20px;} #banner_01_text p b {color:#ffe35f;} #banner_01_text .blank_area {height:40px;} #banner_01_img {width:640px; height:760px; background:url('../../sub/img/banner_cha_01.png') center no-repeat; background-size:cover; position:absolute; top:0; margin-top:1800px; right:0%; margin-left:50px; z-index:-1;} #banner_01_img_blank {width:100%; height:300px; background-color:#fff; position:absolute; z-index:0; top:1890px;} #main_webtoon {width:100%; overflow:hidden; padding:100px 0 0 0; background-color:#e9e9e9; position:relative; z-index:1;} #main_webtoon ul {width:900px; margin:0 auto;} #main_webtoon .main_title {text-align:center;} #main_webtoon .main_title p {font-size:40px; color:#3c3f3f; font-family: 'Roboto', sans-serif; font-weight:900; letter-spacing:2px; padding:40px 0;} #main_webtoon .main_title p span {color:#ff7800;} #main_webtoon .sum {width:100px; height:660px;} #main_webtoon .sum .text {padding:8px 15px 18px 15px; text-align:left; font-size:12px; color:#b9b9b9; line-height:27px; background-color:#111;} #main_webtoon .sum .text p {color:#fff; font-size:14px; font-weight:700; letter-spacing:-1px;} #main_webtoon .sum .over {display:none; background:url('../../sub/img/main_webtoon_bg.png'); width:100%; height:100%; text-align:center;} #main_webtoon .sum .long {line-height:400px;} #main_webtoon .sum .short {line-height:190px;} #main_webtoon .sum .sec_01 {position:absolute; width:140px; height:402px; background-color:#111; } #main_webtoon .sum .sec_01 .img {width:140px; height:443px; border:10px solid #111;} #main_webtoon .sum .sec_02 {position:absolute; width:140px; height:148px; background-color:#111; margin-left:150px;} #main_webtoon .sum .sec_02 .img {width:140px; height:178px; border:10px solid #111;} #main_webtoon .sum .sec_03 {position:absolute; width:140px; height:148px; background-color:#111; margin-left:300px;} #main_webtoon .sum .sec_03 .img {width:140px; height:178px; border:10px solid #111;} #main_webtoon .sum .sec_04 {position:absolute; width:140px; height:148px; background-color:#111; margin-left:450px;} #main_webtoon .sum .sec_04 .img {width:140px; height:178px; border:10px solid #111;} #main_webtoon .sum .sec_05 {position:absolute; width:290px; height:148px; background-color:#111; margin-left:150px; margin-top:265px;} #main_webtoon .sum .sec_05 .img {width:290px; height:178px; border:10px solid #111;} #main_webtoon .sum .sec_06 {position:absolute; width:140px; height:148px; background-color:#111; margin-left:450px; margin-top:265px;} #main_webtoon .sum .sec_06 .img {width:140px; height:178px; border:10px solid #111;} #main_webtoon .sum .sec_07 {position:absolute; width:140px; height:402px; background-color:#111; margin-left:600px;} #main_webtoon .sum .sec_07 .img {width:140px; height:443px; border:10px solid #111;} #main_webtoon .sum .sec_08 {position:absolute; width:140px; height:148px; background-color:#111; margin-left:750px;} #main_webtoon .sum .sec_08 .img {width:140px; height:178px; border:10px solid #111;} #main_webtoon .sum .sec_09 {position:absolute; width:140px; height:148px; background-color:#111; margin-left:750px; margin-top:265px;} #main_webtoon .sum .sec_09 .img {width:140px; height:178px; border:10px solid #111;} #banner_02_bg {width:100%; height:395px; background:url('../../sub/img/banner_02_bg.jpg') center no-repeat; background-size:cover; position:absolute; z-index:-2; top:2850px;} #banner_02_img {width:670px; height:700px; background:url('../../sub/img/banner_cha_02.png') center no-repeat; background-size:cover; position:absolute; top:0; margin-top:3300px; left:50%; margin-left:-600px; z-index:1;} #banner_02_img_blank {width:100%; height:300px; background-color:#fff; position:absolute; z-index:2; top:3245px;} #banner_02_text {width:1000px; height:385px; overflow:hidden; margin:0 auto; font-family: 'NanumSquare', sans-serif; font-size:20px; color:#fff; padding-top:65px; text-align:right;} #banner_02_text p {font-size:50px; font-family: 'Roboto', sans-serif; color:#fff; line-height:55px; font-weight:100; letter-spacing:2px; padding-bottom:20px;} #banner_02_text p b {color:#ffe35f;} #banner_02_text .blank_area {height:40px;} #news {width:100%; background-color:#fff; position:relative; z-index:3; overflow:hidden; padding:100px 0 80px 0;} #news ul { overflow:hidden; width:1000px; margin:0 auto; } #news .main_title { float:none; width:100%; margin-right:50px; font-size:17px; color:#777; line-height:27px; font-weight:700; white-space:normal; word-break:keep-all; text-align:center; } #news .main_title img { display:block; margin:0 auto; } #news .main_title p {font-size:40px; color:#3c3f3f; font-family: 'Roboto', sans-serif; font-weight:900; letter-spacing:2px; padding:40px 0; line-height:45px; text-align:center; } #news .main_title p img {margin-left:5px;} #news .main_title p span {color:#ff7800;} #news .contents {float:left; width:100%; border-top:1px solid #e3e3e3; padding:35px 0 0 0; margin:0px 0 0 0; } #news .contents .list .contents_photo { float:left; width:190px; height:130px; margin:0 25px; background:#eaeaea; } #news .contents .list .contents_photo img { width:100%; height:100%; } #news .contents .list .contents_txt { float:left; width:730px; } #news .contents .list .contents_txt img { margin:0 0 0 10px; } #news .contents .list {overflow:hidden; font-size:15px; line-height:27px; color:#999; border-bottom:1px solid #e3e3e3; padding-bottom:35px; margin-bottom:30px; white-space:normal; word-break:keep-all; } #news .contents .list span { display:block; font-size:13.5px; padding:6px 0 0 0; } #news .contents .list p {color:#222; font-size:20px; font-family: 'NanumSquare', sans-serif; font-weight:900; margin:9px 0 0 0; } .main_btn_black { display:none; } .mobile_main_btn_black { display:block; margin:20px auto 0; } #tail { width:100%; height:auto; overflow:hidden; background-color:#333333; padding:35px 0 20px 0; word-break:keep-all; } #tail ul {padding:0 40px;} #tail .info { overflow:hidden; width:100%; height:auto; padding:0 0 20px 0; border-bottom:1px solid #444; line-height:180%; font-size:12px; color:#8d8d8d; font-weight:700; text-align:center; } #tail .info span { display:inline-block; margin:0 6px; } #tail .info a { color:#8d8d8d; } #tail .info_img{width:45px; margin:0 auto 20px; } #tail .info img { display:block; margin:0px auto 5px; width:100%; } #tail .copy {width:100%; height:80px; line-height:50px; font-size:12px; color:#8d8d8d; font-weight:700; margin:0 6px; text-align:center; } #tail .copy div{height:40px;} #tail .copy div:nth-of-type(1) img{padding:5px 3px 0;} } @media only screen and (min-width: 768px) and (max-width: 1023px){ #main {width:100%; height:800px; background-color:#000; overflow:hidden;} #main .main_01 {width:100%; height:800px; background:url('../../sub/img/main_001.jpg') center no-repeat; background-size:105px;} #main .main_02 {width:100%; height:800px; background:url('../../sub/img/main_002.jpg') center no-repeat; background-size:105px;} #sec_01 {width:100%; overflow:hidden; padding:100px 0;} #sec_01 .main_title {text-align:center;} #sec_01 .main_title p {font-size:40px; color:#3c3f3f; font-family: 'Roboto', sans-serif; font-weight:900; letter-spacing:2px; padding:40px 0; text-transform:uppercase;} #sec_01 .main_title p span {color:#ff7800;} #sec_01 .main_text {text-align:center; font-size:18px; color:#777; line-height:32px; letter-spacing:-1px;} #sec_01 .icon {width:760px; margin:0 auto; padding-top:50px;} #sec_01 .icon li { position:relative; float:left; width:25%; text-align:center;} #sec_01 .icon li a { position:absolute; top:0; left:0; display:block; width:100%; height:100%; } #sec_01 .icon img {width:100px;} #sec_01 .icon li p {color:#3c3f3f; font-size:17px; font-weight:700; padding-top:15px;} #sec_01 .icon .sample {width:100px; height:100px; background-color:#ddd; margin:0 auto; border-radius:100px;} #banner_01_bg {width:100%; height:725px; background:url('../../sub/img/banner_01_bg.jpg') center no-repeat; background-size:cover; position:absolute; z-index:-2; top:1510px;} #banner_01_text {height:725px; overflow:hidden; margin:0 auto; font-family: 'NanumSquare', sans-serif; font-size:20px; color:#fff; padding-top:95px; text-align:center;} #banner_01_text p {font-size:50px; font-family: 'Roboto', sans-serif; color:#fff; line-height:55px; font-weight:100; letter-spacing:2px; padding-bottom:20px;} #banner_01_text p b {color:#ffe35f;} #banner_01_text .blank_area {height:40px;} #banner_01_img {width:550px; height:642px; background:url('../../sub/img/banner_cha_01.png') center no-repeat; background-size:cover; position:absolute; top:0; left:50%; margin-left:-220px; margin-top:2300px; z-index:1; right:10px;} #banner_01_img_blank {width:100%; height:300px; background-color:#fff; position:absolute; z-index:0; top:2300px;} #main_webtoon {width:100%; overflow:hidden; padding:100px 0 800px 0; background-color:#e9e9e9; position:relative; z-index:1;} #main_webtoon ul {width:710px; margin:0 auto;} #main_webtoon .main_title {text-align:center;} #main_webtoon .main_title p {font-size:40px; color:#3c3f3f; font-family: 'Roboto', sans-serif; font-weight:900; letter-spacing:2px; padding:40px 0;} #main_webtoon .main_title p span {color:#ff7800;} #main_webtoon .sum {width:100px; height:660px;} #main_webtoon .sum .text {padding:8px 15px 18px 15px; text-align:left; font-size:13px; color:#b9b9b9; line-height:27px; background-color:#111;} #main_webtoon .sum .text p {color:#fff; font-size:19px; font-weight:700;} #main_webtoon .sum .over {display:none; background:url('../../sub/img/main_webtoon_bg.png'); width:100%; height:100%; text-align:center;} #main_webtoon .sum .long {line-height:550px;} #main_webtoon .sum .short {line-height:220px;} #main_webtoon .sum .sec_01 {position:absolute; width:230px; height:660px; background-color:#111; } #main_webtoon .sum .sec_01 .img {width:230px; height:580px; border:15px solid #111;} #main_webtoon .sum .sec_02 {position:absolute; width:230px; height:325px; background-color:#111; margin-left:240px;} #main_webtoon .sum .sec_02 .img {width:230px; height:245px; border:15px solid #111;} #main_webtoon .sum .sec_03 {position:absolute; width:230px; height:325px; background-color:#111; margin-left:480px;} #main_webtoon .sum .sec_03 .img {width:230px; height:245px; border:15px solid #111;} #main_webtoon .sum .sec_04 {position:absolute; width:230px; height:325px; background-color:#111; margin-top:670px;} #main_webtoon .sum .sec_04 .img {width:230px; height:245px; border:15px solid #111;} #main_webtoon .sum .sec_05 {position:absolute; width:470px; height:325px; background-color:#111; margin-left:240px; margin-top:335px;} #main_webtoon .sum .sec_05 .img {width:470px; height:245px; border:15px solid #111;} #main_webtoon .sum .sec_06 {position:absolute; width:230px; height:325px; background-color:#111; margin-top:1005px;} #main_webtoon .sum .sec_06 .img {width:230px; height:245px; border:15px solid #111;} #main_webtoon .sum .sec_07 {position:absolute; width:230px; height:660px; background-color:#111; margin-left:240px; margin-top:670px;} #main_webtoon .sum .sec_07 .img {width:230px; height:580px; border:15px solid #111;} #main_webtoon .sum .sec_08 {position:absolute; width:230px; height:325px; background-color:#111; margin-left:480px; margin-top:670px;} #main_webtoon .sum .sec_08 .img {width:230px; height:245px; border:15px solid #111;} #main_webtoon .sum .sec_09 {position:absolute; width:230px; height:325px; background-color:#111; margin-left:480px; margin-top:1005px;} #main_webtoon .sum .sec_09 .img {width:230px; height:245px; border:15px solid #111;} #banner_02_bg {width:100%; height:725px; background:url('../../sub/img/banner_02_bg.jpg') center no-repeat; background-size:cover; position:absolute; z-index:-2; top:3990px;} #banner_02_img {width:590px; height:600px; background:url('../../sub/img/banner_cha_02.png') center no-repeat; background-size:cover; position:absolute; top:0; margin-top:5130px; left:50%; margin-left:-295px; z-index:1;} #banner_02_img_blank {width:100%; height:300px; background-color:#fff; position:absolute; z-index:2; top:4715px;} #banner_02_text {text-align:center; width:100%; height:725px; overflow:hidden; margin:0 auto; font-family: 'NanumSquare', sans-serif; font-size:20px; color:#fff; padding-top:65px;} #banner_02_text p {font-size:50px; font-family: 'Roboto', sans-serif; color:#fff; line-height:55px; font-weight:100; letter-spacing:2px; padding-bottom:20px;} #banner_02_text p b {color:#ffe35f;} #banner_02_text .blank_area {height:40px;} #news {width:100%; background-color:#fff; position:relative; z-index:3; overflow:hidden; padding:100px 0 78px 0;} #news ul {padding:0 50px;} #news .main_title {overflow:hidden; width:100%; margin-bottom:0px; font-size:17px; color:#777; line-height:27px; font-weight:700; white-space:normal; word-break:keep-all; text-align:center;} #news .main_title p {font-size:40px; color:#3c3f3f; font-family: 'Roboto', sans-serif; font-weight:900; letter-spacing:2px; padding:40px 0 10px 0; line-height:45px;} #news .main_title p img {margin-left:5px;} #news .main_title p span {color:#ff7800;} #news .contents { width:100%; border-top:1px solid #e3e3e3; padding:30px 0 0 0; } #news .contents .list .contents_photo { float:left; width:190px; height:130px; margin:0 30px 0 20px; background:#eaeaea; } #news .contents .list .contents_photo img { width:100%; height:100%; } #news .contents .list .contents_txt { float:left; width:calc(100% - 250px);} #news .contents .list .contents_txt img { margin:0 0 0 10px; } #news .contents .list {overflow:hidden; font-size:15px; line-height:27px; color:#999; border-bottom:1px solid #e3e3e3; padding-bottom:26px; margin-bottom:35px; white-space:normal; word-break:keep-all; } #news .contents .list span { font-size:14px; display:block; padding:6px 0; height:55px; overflow:hidden; } #news .contents .list span.date { height:25px; margin:0 0 3px 0; overflow:hidden; padding:3px 0 0 0; } #news .contents .list p {color:#222; font-size:18px; font-family: 'NanumSquare', sans-serif; font-weight:900; margin:8px 0 0 0; } .main_btn_black { display:none; } .mobile_main_btn_black { display:block; margin:45px auto 0; } #tail { width:100%; height:auto; overflow:hidden; background-color:#333333; padding:34px 0 20px 0; word-break:keep-all; } #tail ul {padding:0 40px;} #tail .info { overflow:hidden; width:100%; height:auto; padding:0 0 20px 0; border-bottom:1px solid #444; line-height:180%; font-size:12px; color:#8d8d8d; font-weight:700; text-align:center; } #tail .info span { display:inline-block; margin:0 6px; } #tail .info a { color:#8d8d8d; } #tail .info_img{width:45px; margin:0 auto 20px; } #tail .info img { display:block; margin:0px auto 5px; width:100%; } #tail .copy {width:100%; height:80px; line-height:50px; font-size:12px; color:#8d8d8d; font-weight:700; margin:0 6px; text-align:center; } #tail .copy div{height:40px;} #tail .copy div:nth-of-type(1) img{padding:5px 3px 0;} } @media only screen and (max-width: 767px){ #main {width:100%; height:350px; background-color:#000; overflow:hidden;} #main .main_01 {width:100%; height:400px; background:url('../../sub/img/main_001.jpg') center no-repeat; background-size:105px;} #main .main_02 {width:100%; height:400px; background:url('../../sub/img/main_002.jpg') center no-repeat; background-size:105px;} #sec_01 {width:100%; overflow:hidden; padding:50px 0;} #sec_01 .main_title {text-align:center;} #sec_01 .main_title img {width:70px;} #sec_01 .main_title p {font-size:30px; color:#3c3f3f; font-family: 'Roboto', sans-serif; font-weight:900; letter-spacing:2px; padding:20px 0; text-transform:uppercase; } #sec_01 .main_title p span {color:#ff7800;} #sec_01 .main_text {text-align:center; font-size:15px; color:#777; line-height:25px; letter-spacing:-1px; padding:0 20px; white-space:normal; word-break:keep-all;} #sec_01 .icon {padding:35px 15px 0 15px;} #sec_01 .icon li { position:relative; float:left; width:25%; text-align:center;} #sec_01 .icon li a { position:absolute; top:0; left:0; display:block; width:100%; height:100%; } #sec_01 .icon img {width:50px;} #sec_01 .icon li p {color:#3c3f3f; font-size:15px; font-weight:700; padding-top:7px;} #sec_01 .icon .sample {width:50px; height:50px; background-color:#ddd; margin:0 auto; border-radius:50px;} #banner_01_bg {width:100%; height:550px; background:url('../../sub/img/banner_01_bg.jpg') center no-repeat; background-size:cover; position:absolute; z-index:-2; top:860px;} #banner_01_text {height:550px; overflow:hidden; margin:0 auto; font-family: 'NanumSquare', sans-serif; font-size:18px; color:#fff; padding-top:45px; text-align:center;} #banner_01_text p {font-size:30px; font-family: 'Roboto', sans-serif; color:#fff; line-height:35px; font-weight:100; letter-spacing:2px; padding-bottom:10px;} #banner_01_text p b {color:#ffe35f;} #banner_01_text .blank_area {height:40px;} #banner_01_img {width:250px; height:392px; background:url('../../sub/img/banner_cha_01.png') center no-repeat; background-size:cover; position:absolute; top:0; left:50%; margin-top:1400px; left:50%; margin-left:-100px; z-index:-1;} #banner_01_img_blank {width:100%; height:300px; background-color:#fff; position:absolute; z-index:0; top:1410px;} #main_webtoon {width:100%; overflow:hidden; padding:50px 0 50px 0; background-color:#e9e9e9; position:relative; z-index:1;} #main_webtoon ul {width:300px; margin:0 auto;} #main_webtoon .main_title {text-align:center;} #main_webtoon .main_title p {font-size:30px; color:#3c3f3f; font-family: 'Roboto', sans-serif; font-weight:900; letter-spacing:2px; padding:20px 0;} #main_webtoon .main_title p span {color:#ff7800;} #main_webtoon .main_title img {width:70px;} #main_webtoon .sum {width:100px; height:660px;} #main_webtoon .sum .text {padding:4px 8px 12px 8px; text-align:left; font-size:10px; color:#b9b9b9; line-height:18px; background-color:#111;} #main_webtoon .sum .text p {color:#fff; font-size:10px; font-weight:700; letter-spacing:-1px;} #main_webtoon .sum .over {display:none; background:url('../../sub/img/main_webtoon_bg.png'); width:100%; height:100%; text-align:center;} #main_webtoon .sum .long {line-height:550px;} #main_webtoon .sum .short {line-height:220px;} #main_webtoon .sum .sec_01 {position:absolute; width:93px; height:259px; background-color:#111; } #main_webtoon .sum .sec_01 .img {width:93px; height:259px; border:10px solid #111;} #main_webtoon .sum .sec_02 {position:absolute; width:93px; height:131px; background-color:#111; margin-left:103px;} #main_webtoon .sum .sec_02 .img {width:93px; height:99px; border:10px solid #111;} #main_webtoon .sum .sec_03 {position:absolute; width:93px; height:131px; background-color:#111; margin-left:206px;} #main_webtoon .sum .sec_03 .img {width:93px; height:99px; border:10px solid #111;} #main_webtoon .sum .sec_04 {position:absolute; width:93px; height:131px; background-color:#111; margin-top:320px;} #main_webtoon .sum .sec_04 .img {width:93px; height:99px; border:10px solid #111;} #main_webtoon .sum .sec_05 {position:absolute; width:196px; height:131px; background-color:#111; margin-left:103px; margin-top:160px;} #main_webtoon .sum .sec_05 .img {width:196px; height:99px; border:10px solid #111;} #main_webtoon .sum .sec_06 {position:absolute; width:93px; height:131px; background-color:#111; margin-top:480px;} #main_webtoon .sum .sec_06 .img {width:93px; height:99px; border:10px solid #111;} #main_webtoon .sum .sec_07 {position:absolute; width:93px; height:259px; background-color:#111; margin-left:103px; margin-top:320px;} #main_webtoon .sum .sec_07 .img {width:93px; height:259px; border:10px solid #111;} #main_webtoon .sum .sec_08 {position:absolute; width:93px; height:131px; background-color:#111; margin-left:206px; margin-top:320px;} #main_webtoon .sum .sec_08 .img {width:93px; height:99px; border:10px solid #111;} #main_webtoon .sum .sec_09 {position:absolute; width:93px; height:131px; background-color:#111; margin-left:206px; margin-top:480px;} #main_webtoon .sum .sec_09 .img {width:93px; height:99px; border:10px solid #111;} #banner_02_bg {width:100%; height:500px; background:url('../../sub/img/banner_02_bg.jpg') center no-repeat; background-size:cover; position:absolute; z-index:-2; top:2245px;} #banner_02_img {width:250px; height:261px; background:url('../../sub/img/banner_cha_02.png') center no-repeat; background-size:cover; position:absolute; top:0; margin-top:2980px; left:50%; margin-left:-120px; z-index:1;} #banner_02_img_blank {width:100%; height:550px; background-color:#fff; position:absolute; z-index:2; top:2745px;} #banner_02_text {text-align:center; width:100%; height:550px; overflow:hidden; margin:0 auto; font-family: 'NanumSquare', sans-serif; font-size:15px; color:#fff; padding-top:45px;} #banner_02_text p {font-size:30px; font-family: 'Roboto', sans-serif; color:#fff; line-height:35px; font-weight:100; letter-spacing:2px; padding-bottom:10px;} #banner_02_text p b {color:#ffe35f;} #banner_02_text .blank_area {height:40px;} #news {width:100%; background-color:#fff; position:relative; z-index:3; overflow:hidden; padding:0 0 20px 0;} #news ul {padding:0 25px;} #news .main_title {overflow:hidden; width:100%; margin-bottom:0px; font-size:15px; color:#777; line-height:25px; font-weight:700; white-space:normal; word-break:keep-all; text-align:center;} #news .main_title p {font-size:30px; color:#3c3f3f; font-family: 'Roboto', sans-serif; font-weight:900; letter-spacing:2px; padding:20px 0 10px 0; line-height:35px;} #news .main_title p img {margin-left:5px;} #news .main_title p span {color:#ff7800;} #news .main_title img {width:70px;} #news .contents { width:100%; border-top:1px solid #e3e3e3; padding:20px 0 0 0; margin:-15px 0 0 0; } #news .contents .list .contents_photo { float:left; width:130px; height:91px; margin:0 20px 0 0; background:#ffffff; } #news .contents .list .contents_photo img {width:100%; height:100%; } #news .contents .list .contents_txt { float:left; width:calc(100% - 157px);} #news .contents .list .contents_txt img { vertical-align:top; margin:-2px 0 0 10px; } #news .contents .list {overflow:hidden; font-size:13px; line-height:22px; color:#999; border-bottom:1px solid #e3e3e3; padding-bottom:10px; margin-bottom:20px; white-space:normal; word-break:keep-all; } #news .contents .list span { display:block; padding:6px 0; height:32px; overflow:hidden; word-break:break-all; } #news .contents .list span.date { height:25px; margin:0 0 3px 0; } #news .contents .list p {color:#222; font-size:16px; font-family: 'NanumSquare', sans-serif; font-weight:900; margin:6px 0 0 0; } .main_btn_black { display:none; } .mobile_main_btn_black { display:block; margin:20px auto 0; } #tail { width:100%; height:auto; overflow:hidden; background-color:#333333; padding:34px 0 20px 0; word-break:keep-all; } #tail ul {padding:0 40px;} #tail .info { overflow:hidden; width:100%; height:auto; padding:0 0 20px 0; border-bottom:1px solid #444; line-height:180%; font-size:12px; color:#8d8d8d; font-weight:700; text-align:center; } #tail .info span { display:inline-block; margin:0 6px; } #tail .info a { color:#8d8d8d; } #tail .info_img{width:45px; margin:0 auto 20px; } #tail .info img { display:block; margin:0px auto 5px; width:100%; } #tail .copy {width:100%; height:80px; line-height:50px; font-size:12px; color:#8d8d8d; font-weight:700; margin:0 6px; text-align:center; } #tail .copy div{height:40px;} #tail .copy div:nth-of-type(1) img{padding:5px 3px 0;} } /* 헤더 */ #header {background:#121212;margin:0 0 0px;} #header .header_inner {width:1000px;height:100px;margin:0 auto} #header .utilmenu { font-size:12px; color:#111111; letter-spacing:0px; } #header .utilmenu a { font-size:12px; color:#999999; } #header .utilmenu a:hover { font-size:12px; color:#111111; } #header .utilmenu span { font-size:12px; color:#999999; padding:0px 5px; } #header .headmenu { font-size:16px; color:#333333; letter-spacing:0px; text-align:center; } #header .headmenu a { font-size:16px; color:#333333; } #header .headmenu a:hover { font-size:16px; color:#ff0000; } #header .headmenu span { font-size:12px; color:#999999; padding:0px 10px; } /* 풋터 */ #footer .tailmenu { font-size:12px; color:#999999; letter-spacing:0px; line-height:150%; } #footer .tailmenu a { font-size:12px; color:#999999; } #footer .tailmenu a:hover { font-size:12px; color:#111111; } #footer .tailmenu span { font-size: 8px; color:#dddddd; padding:0px 10px; } /* 서브페이지 레이아웃 */ #subvisual {height:200px;background:#f9f9f9} #subvisual .subvisual_inner {width:1000px;text-align:center;} #container { } #container .container_inner {width:1000px;margin:0 auto;padding:50px 0px} #container .sub_title {margin-top:-5px; text-align:left;} #container .sub_title p.subject {color:#111;font-size:32px;margin-bottom:10px;text-align:left; font-weight:bold;} #container .sub_title p.content {color:#aaa;font-size:14px;margin-bottom:40px;text-align:left; } #container .sub_content { } #container .sub_content_etc { } #container .sub_content_etc p.subject {color:#111;font-size:18px;margin-bottom:10px;font-weight:bold;} #container .sub_content_etc p.content {color:#999;font-size:14px;margin-bottom:40px;line-height:150%;} #container .sub_content .sub_tabmenu { } /* 메인페이지 레이아웃 */