@charset "utf-8";

@font-face {
    font-family:'Nanum';
    font-style:normal;
    font-weight:200;
    src:url(../fonts/Nanum/NanumBarunGothicUltraLight.eot);
    src:url(../fonts/Nanum/NanumBarunGothicUltraLight.eot?#iefix) format('embedded-opentype'),
        url(../fonts/Nanum/NanumBarunGothicUltraLight.woff2) format('woff2'),
        url(../fonts/Nanum/NanumBarunGothicUltraLight.woff) format('woff'),
        url(../fonts/Nanum/NanumBarunGothicUltraLight.ttf) format('truetype');
}

@font-face {
    font-family:'Nanum';
    font-style:normal;
    font-weight:400;
    src:url(../fonts/Nanum/NanumBarunGothic.eot);
    src:url(../fonts/Nanum/NanumBarunGothic.eot?#iefix) format('embedded-opentype'),
        url(../fonts/Nanum/NanumBarunGothic.woff2) format('woff2'),
        url(../fonts/Nanum/NanumBarunGothic.woff) format('woff'),
        url(../fonts/Nanum/NanumBarunGothic.ttf) format('truetype');
}

@font-face {
    font-family:'Nanum';
    font-style:normal;
    font-weight:700;
    src:url(../fonts/Nanum/NanumBarunGothicBold.eot);
    src:url(../fonts/Nanum/NanumBarunGothicBold.eot?#iefix) format('embedded-opentype'),
        url(../fonts/Nanum/NanumBarunGothicBold.woff2) format('woff2'),
        url(../fonts/Nanum/NanumBarunGothicBold.woff) format('woff'),
        url(../fonts/Nanum/NanumBarunGothicBold.ttf) format('truetype');
}
  
@font-face {
    font-family:'Euphemia';
    font-style:normal;
    src:url(../fonts/Euphemia/Euphemia.eot);
    src:url(../fonts/Euphemia/Euphemia.eot?#iefix) format('embedded-opentype'), 
        url(../fonts/Euphemia/Euphemia.woff2) format('woff2'),
        url(../fonts/Euphemia/Euphemia.woff) format('woff'), 
        url(../fonts/Euphemia/Euphemia.ttf) format('truetype'), 
        url(../fonts/Euphemia/Euphemia.svg#Euphemia) format('svg'); 
}

/********************* 
 reset 
*********************/
html {font-size:12px;}
body {background:#fff;}
body,p,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,table,th,td,form,fieldset,legend,input,textarea,button,select {margin:0; padding:0;}
h1,h2,h3,h4,h5,h6,th {font-size:100%; font-weight:normal}
body,input,textarea,select,button,table {font-family:'Nanum',Dotum,sansserif; font-weight:400; color:#343434;}
input,img,fieldset {border:0;}
dl,ul,ol,menu,li {list-style:none;}
address,caption,cite,code,dfn,em,var,i {font-style:normal; font-weight:normal;}
blockquote, q {quotes:none}
blockquote:before,blockquote:after,q:before,q:after {content:''; content:none;}
a {color:inherit; text-decoration:none; cursor:pointer;}
table {width:100%; padding:0; border:0; border-spacing:0px; border-collapse:collapse; table-layout:fixed;}
th,td {padding:0px;}
button {border:0; background-color:transparent; cursor:pointer;}
button:focus, input:focus, textarea:focus, select:focus {outline:none;}
input,select,textarea,button,img {vertical-align:middle;}
input,select,textarea {-webkit-box-sizing:border-box; box-sizing:border-box;}
input::-ms-clear {display:none;} /* ie x제거 */
select::-ms-expand {display:none;} /* ie 화살표제거 */
select {-webkit-appearance:none; -moz-appearance:none; appearance:none; border-radius:0;} /* mac bdrs_0 */ 



/********************* 
 common 
*********************/
html, body {height:100%;}
body.no_scroll {position:fixed; overflow:hidden; width:100%;} /* 팝업 오픈시 적용 */
.wrap {position:relative; min-width:320px; height:100%;}
.container {position:relative; width:1200px; height:100%; margin:auto;}
.hide {position:absolute; overflow:hidden; width:0; height:0; line-height:0; text-indent:-9999px}
.sketch {position:absolute; top:0; left:0;}



/********************* 
 header/footer
*********************/
.header {position:fixed; width:100%; height:105px; background:rgba(0,0,0,0); color:#fff; font-family:'Euphemia'; font-size:16px; z-index:1000; user-select:none;}
.header .h1 {float:left;}
.header .h1 a {display:block; width:169px; height:48px; margin:32px 0 0 23px; background:url(../img/header/logo.png) no-repeat center; background-size:contain; text-indent:-9999px;}
.header .util {float:right; margin:10px 22px 0 0;}
.header .util li {float:left; width:31px; height:30px; margin-left:9px; cursor:pointer;}
.header .util li a {display:block; width:100%; height:100%;}
.header .util .kr {position:relative; width:auto; font-family:'Nanum'; font-size:17px; font-weight:700; line-height:34px; cursor:pointer; user-select:none;}
.header .util .download {position:relative; background:url(../img/header/download.png) no-repeat center; margin-left:28px;}
.header .util .facebook {background:url(../img/header/facebook.png) no-repeat center;}
.header .util .youtube {background:url(../img/header/youtube.png) no-repeat center;}
.header .util .mail {background:url(../img/header/mail.png) no-repeat center;}
.header .util > li .select {display:none; position:absolute; top:30px; left:-7px; padding:5px 10px; background:#eee; border-radius:5px; font-size:14px; font-weight:700; color:#555; z-index:100; user-select:none;}
.header .util .download .select {top:37px; left:0; text-decoration:underline;}
.header .util > li .select a {display:block; line-height:20px;}
.header .menu {position:absolute; top:70px; right:25px;}
.header .menu li {float:left; margin-left:65px; line-height:12px;}
.header .ico_menu {display:none; float:right;}
.header .ico_menu img {display:block; width:30px; margin:18px 20px 0 0;}
.menu_m {display:none;}
.footer {position:relative; width:100%; background:#3f3a39; color:#fff; text-align:center; font-weight:200;}
.footer .util {padding:25px 0 28px 0;}
.footer .util li {display:inline-block; width:19px; height:20px; font-size:0;}
.footer .util .download {margin-right:23px; background:url(../img/footer/download.png) no-repeat center;}
.footer .util .facebook {width:11px; margin-right:24px; background:url(../img/footer/facebook.png) no-repeat center;}
.footer .util .youtube {width:22px; margin-right:18px; background:url(../img/footer/youtube.png) no-repeat center;}
.footer .util .mail {background:url(../img/footer/mail.png) no-repeat center;}
.footer .link {margin-bottom:17px;}
.footer .link li {display:inline-block;}
.footer .link li:first-child::after {display:inline-block; padding:0 5px 0 7px; content:'|';}
.footer .addr {margin-bottom:10px;}
.footer .copy {padding-bottom:22px; font-weight:400;}



/********************* 
 visual
*********************/
.visual {height:100%;}
.visual .tit_area {position:absolute; bottom:82px; left:0; width:100%; color:#fff; font-size:21px;}
.visual .tit_area .tit {position:absolute; bottom:38px; left:0;}
.visual .tit_area .sub_tit {position:absolute; bottom:0; left:0;}
.visual .tit_area_center .tit {position:absolute; top:50%; left:50%;}



/********************* 
 section
*********************/
.section {padding:131px 0 167px 0; background:#fff;}
.section .h2 {margin-bottom:56px;}
.section .h2 .tit {display:block; width:100%; height:53px; margin-bottom:14px; text-indent:-9999px;}
.section .h2 .sub_tit {display:block; width:100%; text-align:center; font-size:20px; font-weight:200;}



/********************* 
 tab
*********************/
.tab {display:block; position:relative; width:982px; height:63px; margin:auto; background:#d3d3d3; border-radius:10px; line-height:63px; font-size:29px; font-weight:700; text-align:center; color:#8e7876;}
.tab li {position:absolute; cursor:pointer; user-select:none;}
.tab li.on {top:-4px; border:4px solid #e8431f; background:#fff; border-radius:15px; color:#531711;}
.tab li.on::after {position:absolute; bottom:-23px; left:50%; width:46px; height:23px; margin-left:-19px; background:url(../img/tab_arrow.png) no-repeat center; content:'';}
.tab_con {min-height:550px;}
.tab_con > li {display:none;}
.tab_con > li.on {display:block;}
.wrap_tab_m {display:none;}



/********************* 
 main
*********************/
.visual_main {overflow:hidden;}
.visual_main .slide_visual {position:relative; width:100%; height:100%;}
.visual_main .slide_visual .slick-list {height:100%;}
.visual_main .slide_visual .slick-list .slick-track {height:100%;}
.visual_main .slide_visual .slick-slide > div {height:100%;}
.visual_main .slide_visual .btn_slide {position:absolute; top:50%; width:47px; height:83px; margin-top:-41px; z-index:999;}
.visual_main .slide_visual .btn_slide.left {left:175px; background:url(../img/main/slide_left.png) no-repeat center; background-size:contain;}
.visual_main .slide_visual .btn_slide.right {right:175px; background:url(../img/main/slide_right.png) no-repeat center; background-size:contain;}
.visual_main .slide_visual .slick-dots {position:absolute; bottom:46px; width:100%; text-align:center; z-index:99;}
.visual_main .slide_visual .slick-dots li {display:inline-block; margin:0 8px;}
.visual_main .slide_visual .slick-dots li a {display:block; width:13px; height:13px; background:#fff; border-radius:16px;}
.visual_main .slide_visual .slick-dots li.slick-active a {background:#662872;}
.visual_main .slide_visual .scene {position:relative; overflow:hidden; width:100%; height:100%;}
.visual_main .slide_visual .scene .layer {position:absolute; top:0; left:0; width:100%; height:100%;}
.visual_main .slide_visual .scene .layer .bg {position:absolute; top:50%; left:50%; width:110%; height:110%; -webkit-transform:translate(-50%, -50%); -ms-transform:translate(-50%, -50%); transform:translate(-50%, -50%);}
.visual_main .slide_visual .scene .btn_move {z-index:100;} 
/* lucy */
.visual_main .slide_visual .scene.lucy .layer_01 .bg {background:url(../img/main/visual_lucy_01.jpg) no-repeat center; background-size:cover;}
.visual_main .slide_visual .scene.lucy .layer_02 .bg {background:url(../img/main/visual_lucy_02.png) no-repeat center; background-size:cover;}
.visual_main .slide_visual .scene.lucy .layer_03 .bg {background:url(../img/main/visual_lucy_03.png) no-repeat center; background-size:cover;}
.visual_main .slide_visual .scene.lucy .btn_move {width:420px; height:260px; background:url(../img/main/btn_move_lucy.png) no-repeat center; background-size:contain;}
/* tori */
.visual_main .slide_visual .scene.tori .layer_01 .bg {background:url(../img/main/visual_tori_01.jpg) no-repeat center; background-size:cover;}
.visual_main .slide_visual .scene.tori .layer_02 .bg {background:url(../img/main/visual_tori_02.png) no-repeat center; background-size:cover;}
.visual_main .slide_visual .scene.tori .layer_03 .bg {width:115%; height:115%; background:url(../img/main/visual_tori_03.png) no-repeat center; background-size:cover;}
.visual_main .slide_visual .scene.tori .btn_move {width:446px; height:132px; margin-left:-170px; background:url(../img/main/btn_move_tori.png) no-repeat center; background-size:contain;}
/* kuku */
.visual_main .slide_visual .scene.kuku .layer_01 .bg {background:url(../img/main/visual_kuku_01.jpg) no-repeat center; background-size:cover;}
.visual_main .slide_visual .scene.kuku .layer_02 .bg {background:url(../img/main/visual_kuku_02.png) no-repeat center; background-size:cover;}
.visual_main .slide_visual .scene.kuku .layer_03 .bg {width:110%; height:110%; background:url(../img/main/visual_kuku_03.png) no-repeat center; background-size:cover;}
.visual_main .slide_visual .scene.kuku .layer_04 .bg {background:url(../img/main/visual_kuku_04.png) no-repeat center; background-size:cover;}
.visual_main .slide_visual .scene.kuku .btn_move {width:414px; height:155px; background:url(../img/main/btn_move_kuku.png) no-repeat center; background-size:contain;}
/* teny */
.visual_main .slide_visual .scene.teny .layer_01 .bg {background:url(../img/main/visual_teny_01.jpg) no-repeat center; background-size:cover;}
.visual_main .slide_visual .scene.teny .layer_02 .bg {background:url(../img/main/visual_teny_02.png) no-repeat center; background-size:cover;}
.visual_main .slide_visual .scene.teny .layer_03 .bg {background:url(../img/main/visual_teny_03.png) no-repeat center; background-size:cover;}
.visual_main .slide_visual .scene.teny .btn_move {width:444px; height:313px; margin-left:-226px; background:url(../img/main/btn_move_teny.png) no-repeat center; background-size:contain;}
.section_main .h2 .tit {background:url(../img/main/section_tit.png) no-repeat center;}
.section_main .list_thumb {overflow:hidden; padding:0px 31px;}
.section_main .list_thumb li {float:left; margin-left:22px; text-align:center; font-size:18px; cursor:pointer;}
.section_main .list_thumb li:first-child {margin-left:0;}
.section_main .list_thumb li img {display:block; width:268px; height:187px; margin-bottom:26px;}
.section_main .list_thumb li .name {display:block; margin-bottom:12px;}
.section_main .list_thumb li .ex {display:block;}
.section_main .btn_more {display:block; width:293px; height:67px; margin:107px auto 0; background:url(../img/main/btn_more.png) no-repeat center; background-size:contain;}



/********************* 
 about
*********************/
.visual_about {background:url(../img/about/visual_about.jpg) no-repeat center; background-size:cover;}
.visual_about .tit_area .tit {width:271px; height:64px; background:url(../img/about/visual_about_tit.png) no-repeat bottom left; background-size:contain;}
.section_about.message {padding-bottom:126px;}
.section_about.message .h2 {margin-bottom:184px;}
.section_about.message .h2 .tit {margin-bottom:0; background:url(../img/about/section_tit_01.png) no-repeat center;}
.section_about.message .message {display:block;}
.section_about.message .message_m {display:none;}
.section_about.message img {width:100%;}
.section_about.history .history {display:block;}
.section_about.history .history_m {display:none;}
.section_about.history .h2 {margin-bottom:145px;}
.section_about.history .h2 .tit {margin-bottom:0; background:url(../img/about/section_tit_02.png) no-repeat center;}
.section_about.history .history ul {width:100%; height:538px;}
.section_about.history .history li {position:absolute; bottom:0;}
.section_about.history .history .h_01 {left:0;}
.section_about.history .history .h_02 {left:428px;}
.section_about.history .history .h_03 {left:715px;}
.section_about.history .history .h_04 {left:919px;}
.section_about.partners {background:#ebebeb;}
.section_about.partners .grid {overflow:hidden; width:100%; padding:45px 0;}
.section_about.partners .grid li {float:left; width:16.666%; height:80px; line-height:80px; text-align:center;}



/********************* 
 business
*********************/
.visual_business {background:url(../img/business/visual_business.jpg) no-repeat center; background-size:cover;}
.visual_business .tit_area .tit {width:271px; height:64px; background:url(../img/business/visual_business_tit.png) no-repeat bottom left; background-size:contain;}
.section_business {padding-bottom:230px;}
.section_business .h2 {margin-bottom:110px;}
.section_business .h2 .tit {margin-bottom:19px; background:url(../img/business/section_tit.png) no-repeat center;}
.section_business .h2 .sub_tit {font-weight:400; line-height:29px;}
.section_business .tab .tab_01 {width:252px;}
.section_business .tab .tab_02 {left:337px; width:252px;}
.section_business .tab .tab_03 {right:0; width:323px;}
.section_business .tab_con > li {overflow:hidden;}
.section_business .tab_con .img_area {float:left;}
.section_business .tab_con .txt_area {float:left; font-size:20px;}
.section_business .tab_con .txt_area .tit {display:block; margin-bottom:34px; font-size:29px; font-weight:700; color:#531711;}
.section_business .tab_con .txt_area dl {margin-bottom:40px;}
.section_business .tab_con .txt_area dt {margin-bottom:11px;}
.section_business .tab_con .txt_area dd {line-height:25px;}
.section_business .tab_con .con_01 {padding:75px 0 0 67px;}
.section_business .tab_con .con_01 .txt_area {margin-left:42px;}
.section_business .tab_con .con_02 {padding:130px 0 0 74px;}
.section_business .tab_con .con_02 .img_area img {padding-top:25px;}
.section_business .tab_con .con_02 .txt_area {margin-left:46px;}
.section_business .tab_con .con_03 {padding:117px 0 0 192px;}
.section_business .tab_con .con_03 .txt_area {margin-left:31px;}
.section_business p {display:block; text-align:center; font-size:18px; line-height:29px;}
.m_business_p {display:none;}



/********************* 
 character
*********************/
.visual_character {background:url(../img/character/visual_character.jpg) no-repeat center; background-size:cover;}
.visual_character .tit_area_center .tit {width:688px; height:113px; background:url(../img/character/visual_character_tit.png) no-repeat center; background-size:contain; -webkit-transform:translate(-50%, -15%); -ms-transform:translate(-50%, -15%); transform:translate(-50%, -15%);}
.section_character {background:#eee;}
.section_character .h2 {margin-bottom:52px;}
.section_character .h2 .tit {margin-bottom:32px; background:url(../img/character/character_tit.png) no-repeat center;}
.section_character .h2 .sub_tit {font-size:15px; font-weight:400; line-height:24px;}
.section_character .grid {overflow:hidden; padding:10px 45px 0;}
.section_character .grid .grid_item {position:relative; float:left; width:322px; margin:0 24px 61px 24px;}
.section_character .grid .img_area {position:relative; height:317px; background:#981b15; z-index:2;}
.section_character .grid .img_area img {position:absolute;}
.section_character .grid .name_area {position:relative; height:145px; background:#fff;}
.section_character .grid .name_area::after {position:absolute; bottom:41px; right:21px; width:31px; height:32px; content:''; background:url(../img/character/btn_more.png) no-repeat center;}
.section_character .grid .name_area > span {position:absolute; left:22px;}
.section_character .grid .name_area .ko {bottom:56px; font-weight:200; font-size:16px;}
.section_character .grid .name_area .en {bottom:30px; font-weight:700; font-size:20px;}
.section_character .grid .grid_item:hover .img_area img {-webkit-transform:scale(1.02); -ms-transform:scale(1.02); transform:scale(1.02); -webkit-transition:all 0.3s; -o-transition:all 0.3s; transition:all 0.3s;}
.section_character .grid .grid_item_01 .img_area img {left:-26px; bottom:-25px;}
.section_character .grid .grid_item_02 .img_area {background:#1e2f36;}
.section_character .grid .grid_item_02 .img_area img {left:-35px; bottom:-63px;}
.section_character .grid .grid_item_03 .img_area {background:#da180e;}
.section_character .grid .grid_item_03 .img_area img {left:-28px; bottom:-20px;}
.section_character .grid .grid_item_04 .img_area {background:#12765e;}
.section_character .grid .grid_item_04 .img_area img {left:-8px; bottom:-23px;}
.section_character .grid .grid_item_05 .img_area {background:#136783;}
.section_character .grid .grid_item_05 .img_area img {left:-16px; bottom:-19px;}
.section_character .grid .grid_item_06 .img_area {background:#a1c7d2;}
.section_character .grid .grid_item_06 .img_area img {left:-16px; bottom:-25px;}
.section_character .grid .grid_item_07 .img_area {background:#f4b2a2;}
.section_character .grid .grid_item_07 .img_area img {left:-8px; bottom:-22px;}
.section_character .grid .grid_item_08 .img_area {background:#cecece;}
.section_character .grid .grid_item_08 .img_area img {left:81px; bottom:-22px;}
.section_character .grid .grid_item_09 .img_area {background:#e0b74d;}
.section_character .grid .grid_item_09 .img_area img {left:-1px; bottom:-24px;}
.section_character .grid .grid_item .top_layer {display:none; position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.5); color:#fff; font-size:25px; text-align:center; line-height:462px; z-index:2;}
.section_character .grid .grid_item:hover .top_layer {display:block;}



/********************* 
 character sub
*********************/
.section_char .bg img {width:100%;}
.section_char .bg_m {display:none;}
.section_char .bg_m img {width:100%;}
/* tori */
.visual_char.tori {background:url(../img/character_sub/tori/visual_tori.jpg) no-repeat center; background-size:cover;}
.visual_char.tori .bubble {height:100%;}
.section_char {position:relative;}
.section_char .h2 {position:absolute; top:0; left:0; right:0; width:95%; margin:auto;}
.section_char .h2 img {width:100%;}
/* lucy */
.visual_char.lucy {background:url(../img/character_sub/lucy/visual_lucy.jpg) no-repeat center; background-size:cover;}
.visual_char.lucy .firefly {height:100%;}
/* kuku */
.visual_char.kuku .scene {position:relative; overflow:hidden; width:100%; height:100%;}
.visual_char.kuku .scene .layer {position:absolute; top:0; left:0; width:100%; height:100%;}
.visual_char.kuku .scene .layer .bg {position:absolute; top:50%; left:50%; width:110%; height:110%;  -webkit-transform:translate(-50%, -50%); -ms-transform:translate(-50%, -50%); transform:translate(-50%, -50%);}
.visual_char.kuku .scene .layer_01 .bg {background:url(../img/character_sub/kuku/layer_kuku_01.jpg) no-repeat center; background-size:cover;} 
.visual_char.kuku .scene .layer_02 .bg {width:100%; height:100%; background:url(../img/character_sub/kuku/layer_kuku_02.png) no-repeat center; background-size:cover;} 
.visual_char.kuku .scene .layer_03 .bg {width:100%; height:100%; background:url(../img/character_sub/kuku/layer_kuku_03.png) no-repeat center; background-size:cover;} 
.visual_char.kuku .under_bg {position:absolute; left:0; bottom:0; width:100%;}
.visual_char.kuku .under_bg img {width:100%;}
/* teny */
.visual_char.teny {background:url(../img/character_sub/teny/visual_teny.jpg) no-repeat center; background-size:cover;}
.visual_char.teny h2 {position:absolute; top:25%; width:100%; text-align:center;}
.visual_char.teny h2 img {display:inline-block; height:100%; transform: scale(0);}



/********************* 
illustration
*********************/
.visual_illustration {background:url(../img/illustration/visual_illustration.jpg) no-repeat center; background-size:cover;}
.visual_illustration .tit_area_center .tit {width:852px; height:281px; background:url(../img/illustration/visual_illustration_tit.png) no-repeat center; background-size:contain; -webkit-transform:translate(-50%, -15%); -ms-transform:translate(-50%, -15%); transform:translate(-50%, -15%);}
.section_illustration .h2 {margin-bottom:118px;}
.section_illustration .h2 .tit {margin-bottom:30px; background:url(../img/illustration/illustration_tit.png) no-repeat center;}
.section_illustration .h2 .sub_tit {font-size:15px; font-weight:400; line-height:24px;}
.section_illustration .tab .tab_01 {width:212px;}
.section_illustration .tab .tab_02 {left:240px; width:212px;}
.section_illustration .tab .tab_03 {left:504px; width:214px;}
.section_illustration .tab .tab_04 {right:0; width:214px;}
.section_illustration .tab_con .con {margin:110px 0 0 82px;}
.section_illustration .tab_con .con_04 {margin-left:54px;}
.section_illustration .tab_con .list_thumb li {margin-bottom:70px;}
.section_illustration .tab_con .list_thumb li img {cursor:pointer;}



/********************* 
contact
*********************/
.visual_contact {background:url(../img/contact/visual_contact.jpg) no-repeat center; background-size:cover;}
.visual_contact .tit_area .tit {width:349px; height:65px; background:url(../img/contact/visual_contact_tit.png) no-repeat bottom left; background-size:contain;}
.section_contact.contact {padding:192px 0 125px 0;}
.section_contact.contact .h2 {margin-bottom:128px;}
.section_contact.contact .h2 .tit {margin-bottom:29px; background:url(../img/contact/section_tit.png) no-repeat center;}
.section_contact.contact .h3 {display:block; width:126px; height:126px; margin:auto; padding-bottom:65px; background:url(../img/contact/h3.png) no-repeat top center; background-size:contain;}
.section_contact.contact dl {text-align:center; font-size:15px; line-height:24px;}
.section_contact.contact span {font-weight:200;}
.section_contact.contact .location {display:inline-block; width:24px; height:30px; margin-bottom:12px; background:url(../img/contact/ico_location.png) no-repeat center;}
.section_contact.contact .mail {display:inline-block; width:30px; height:22px; margin:36px 0 16px 0; background:url(../img/contact/ico_mail.png) no-repeat center;}
.section_contact.contact .phone {display:inline-block; width:28px; height:38px; margin:37px 0 2px 0; background:url(../img/contact/ico_phone.png) no-repeat center;}
.section_contact.map {width:100%; height:auto; padding:0;}
.section_contact.send {padding:125px 0 160px 0;}
.section_contact.send .h2 {margin-bottom:145px;}
.section_contact.send .h2 .tit {margin-bottom:23px; background:url(../img/contact/section_tit_02.png) no-repeat center;}
.section_contact.send .h2 .sub_tit {line-height:28px;}
.section_contact.send .btn_submit {display:block; width:276px; height:67px; margin:auto; background:url(../img/contact/btn_submit.png) no-repeat center; background-size:contain;}
.section_contact.send .send_form {width:765px; margin:auto;}
.section_contact.send .send_form dt {font-weight:200; font-size:20px; line-height:28px;}
.section_contact.send .send_form dd {margin-bottom:27px;}
.section_contact.send .send_form input {width:100%; height:35px; padding:0 20px; background:#efefee;}
.section_contact.send .send_form textarea {width:100%; height:126px; margin-bottom:57px; padding:15px 20px; border:none; background:#efefee; resize:none;}



/********************* 
 magazine
*********************/
.visual_magazine {background:url(../img/magazine/visual_magazine.jpg) no-repeat center; background-size:cover;}
.visual_magazine .tit_area .tit {width:422px; height:80px; background:url(../img/magazine/visual_magazine_tit.png) no-repeat bottom left; background-size:contain;}
.section_magazine .h2 {margin-bottom:134px;}
.section_magazine .h2 .tit {background:url(../img/magazine/section_tit.png) no-repeat center;}
.section_magazine .grid {overflow:hidden; max-width:1152px; padding:0 24px;}
.section_magazine .grid .grid_item {width:346px; height:auto; margin:0 19px; padding-bottom:50px; cursor:pointer;}
.section_magazine .grid .grid_item img {display:block; max-width:346px; margin-bottom:36px;}
.section_magazine .grid .grid_item .txt dd {margin-bottom:3px; font-weight:200; font-size:16px;}
.section_magazine .grid .grid_item .txt .name {margin-bottom:15px; font-weight:700; font-size:18px;}
.section_magazine .grid .grid_item .txt .date {margin-top:23px; font-size:15px;}



/********************* 
 pop
*********************/
.modal {display:none; position:fixed; top:0; bottom:0; left:0; right:0; background:rgba(0,0,0,0.5); content:''; z-index:1001;}
.pop {display:none; position:fixed; top:50%; left:50%; -webkit-transform:translate(-50%, -50%); -ms-transform:translate(-50%, -50%); transform:translate(-50%, -50%); z-index:1002;}
/* magazine */
.pop_magazine {width:1060px; background:#fff;}
.pop_magazine .img_area {float:left; overflow:hidden; width:604px; height:438px; background:#fff; line-height:438px; text-align:center;}
.pop_magazine .img_area img {display:inline-block; width:604px; height:438px; max-width:100%; max-height:100%;}
.pop_magazine .img_area.org img {width:auto;}
.pop_magazine .img_area .btn_slide {position:absolute; top:50%; width:40px; height:40px; margin-top:-20px; z-index:999;}
.pop_magazine .img_area .btn_slide.left {left:20px; background:url(../img/main/slide_left.png) no-repeat center; background-size:contain;}
.pop_magazine .img_area .btn_slide.right {right:20px; background:url(../img/main/slide_right.png) no-repeat center; background-size:contain;}
.pop_magazine .txt_area {position:relative; float:right; width:412px; height:398px; padding:20px 22px;}
.pop_magazine .txt_area.scroll {overflow-y:scroll;}
.pop_magazine .txt_area dl {overflow:hidden; font-size:13pxs;}
.pop_magazine .txt_area dl dt {float:left; min-height:32px; font-weight:700; line-height:18px;}
.pop_magazine .txt_area dl dd {float:left; margin-bottom:15px; padding-left:3px; line-height:18px; font-weight:200;}
.pop_magazine .txt_area p {margin:18px 0 25px 0; font-size:12px; font-weight:200; line-height:21px;}
.pop_magazine .txt_area span {display:inline-block; font-size:10px; font-weight:200;}
.pop_magazine .txt_area .em {margin:4px 0 19px 0; font-size:13px; font-weight:700; line-height:17px;}
.pop_magazine .txt_area .date {margin-bottom:16px; font-size:12px;}
.pop_magazine .close_pop {position:absolute; top:2px; right:-31px; width:22px; height:22px; background:url(../img/magazine/pop/close_pop.png) no-repeat center;}
/* illustration */
.pop_illustration {width:870px; height:615px; background:#231815;}
.pop_illustration .pop_con {display:none;}
.pop_illustration img {max-height:615px; margin:auto;}
.pop_illustration .btn_slide {position:absolute; top:50%; width:44px; height:75px; margin-top:-37px; z-index:999;}
.pop_illustration .btn_slide.left {left:-101px; background:url(../img/illustration/pop/btn_left.png) no-repeat center; background-size:contain;}
.pop_illustration .btn_slide.right {right:-101px; background:url(../img/illustration/pop/btn_right.png) no-repeat center; background-size:contain;}
.pop_illustration .close_pop {position:absolute; top:1px; right:-26px; width:21px; height:21px; background:url(../img/illustration/pop/close_pop.png) no-repeat center;}




/********************* 
 media query
*********************/
@media all and (max-width:1024px) {
    /* common */
    .container {width:100%;}

    /* header */
    .header {height:60px; background:rgba(0,0,0,0.3);}
    .header .h1 a {width:105px; height:30px; margin-top:16px;}
    .header .util, .header .menu {display:none;}
    .header .ico_menu {display:block;}
    .menu_m {display:none; position:fixed; width:100%; height:100%; background:rgba(0,0,0,0.8); z-index:2000;}
    .menu_m .btn_x {position:absolute; top:15px; right:15px;}
    .menu_m .btn_x img {width:20px;}
    .menu_m .list_menu {position:absolute; top:50%; left:50%; text-align:center; color:#fff; font-size:20px; -webkit-transform:translate(-50%, -50%); -ms-transform:translate(-50%, -50%); transform:translate(-50%, -50%);}
    .menu_m .list_menu > li {overflow:hidden; padding:12px 0;}
    .menu_m .list_menu .wrap_util {overflow:visible;}
    .menu_m .list_menu .util {padding-top:10px;}
    .menu_m .list_menu .util > li {float:left; width:22px; height:21px; margin-left:9px;}
    .menu_m .list_menu .util > li > a {display:inline-block; width:100%; height:100%;}
    .menu_m .list_menu .util .kr {position:relative; width:auto; margin-left:0; font-family:'Nanum'; font-size:14px; font-weight:700; line-height:22px;}
    .menu_m .list_menu .util .download {position:relative; background:url(../img/header/download.png) no-repeat center; background-size:cover;}
    .menu_m .list_menu .util .facebook {background:url(../img/header/facebook.png) no-repeat center; background-size:cover;}
    .menu_m .list_menu .util .youtube {background:url(../img/header/youtube.png) no-repeat center; background-size:cover;}
    .menu_m .list_menu .util .mail {background:url(../img/header/mail.png) no-repeat center; background-size:cover;}
    .menu_m .list_menu .util > li .select {display:none; position:absolute; bottom:25px; left:-7px; padding:5px 10px; background:#eee; border-radius:5px; font-size:14px; font-weight:700; color:#555; z-index:100; user-select:none;}
    .menu_m .list_menu .util > li .select a {display:block; line-height:20px;}

    /* visual */
    .visual .scene .layer {display:none;}
    .visual .tit_area .tit {width:35%; margin-left:15px;}
    .visual .tit_area .sub_tit {padding:0 15px;}
    .visual .tit_area_center .tit {width:50%;}

    /* section */
    .section {padding:10% 0 15%;}

    /* tab */
    .tab {display:none;}
    .wrap_tab_m {display:block; line-height:40px;}
    .wrap_tab_m .tab_m {width:100%; height:40px; background:#eee; font-size:14px; font-weight:700; text-align:center; color:#8e7876; -webkit-box-sizing:border-box; box-sizing:border-box;}
    .wrap_tab_m .tab_m li {position:relative; display:inline-block; margin:0 15px; cursor:pointer;}
    .wrap_tab_m .tab_m li.on::after {position:absolute; bottom:0; left:0; width:100%; height:2px; background:#e8431f; content:'';}

    /* main */
    .visual_main .slide_visual .lucy {background:url(../img/main/m/visual_lucy.jpg) no-repeat center; background-size:cover;}
    .visual_main .slide_visual .tori {background:url(../img/main/m/visual_tori.jpg) no-repeat center; background-size:cover;}
    .visual_main .slide_visual .kuku {background:url(../img/main/m/visual_kuku.jpg) no-repeat center; background-size:cover;}
    .visual_main .slide_visual .teny {background:url(../img/main/m/visual_teny.jpg) no-repeat center; background-size:cover;}
    .visual_main .slide_visual .scene.lucy .btn_move {position:absolute; bottom:20%; left:10%; width:50%; height:30%;}
    .visual_main .slide_visual .scene.tori .btn_move {position:absolute; top:18%; left:9%; width:100%; height:20%; margin:0;}
    .visual_main .slide_visual .scene.kuku .btn_move {position:absolute; top:18%; width:100%; height:20%;}
    .visual_main .slide_visual .scene.teny .btn_move {position:absolute; top:18%; width:100%; height:35%; margin:0;}
    .visual_main .slide_visual .btn_slide {top:55%; width:20px; height:43px;}
    .visual_main .slide_visual .btn_slide.left {left:5%;}
    .visual_main .slide_visual .btn_slide.right {right:5%;}
    .visual_main .slide_visual .slick-dots {bottom:5%;}
    .visual_main .slide_visual .slick-dots li {margin:0 5px;}
    .visual_main .slide_visual .slick-dots li a {width:8px; height:8px;}
    .section_main .list_thumb {width:580px; margin:auto; padding:0;}
    .section_main .list_thumb li {margin:0 11px 35px;}
    .section_main .list_thumb li:first-child {margin:0 11px 35px;}
    .section_main .list_thumb li img {margin-bottom:15px;}

    /* about */
    .section_about.message {padding-bottom:30px;}
    .section_about.message .h2 {margin-bottom:35px;}
    .section_about.message .message {display:none;}
    .section_about.message .message_m {display:block;}
    /* .section_about.history .h2 {margin-bottom:35px;} */
    .section_about.history .h2 {display:none;}
    .section_about.history .history {display:none;}
    .section_about.history .history_m {display:block;}
    .section_about.history .history_m img {display:block; max-width:100%;}

    /* business */
    .section_business .h2 {margin-bottom:50px;}
    .section_business .tab_con .con {padding:0;}
    .section_business .tab_con .img_area {float:none; width:100%; padding-top:20px; text-align:center;}
    .section_business .tab_con .con .img_area img {max-width:100%;}
    .section_business .tab_con .con .txt_area {float:none; margin:0; padding:20px 10px 0 10px; font-size:14px;}
    .section_business .tab_con .txt_area .tit {font-size:20px; margin-bottom:20px;}
    .section_business .tab_con .con .txt_area dt {font-weight:700;}
    .section_business .tab_con .con .txt_area dd {line-height:20px;}
    .section_business p {display:none;}
    .m_business_p {display:block; background:#ccc2b4; padding:15px 5px; font-size:12px; line-height:20px; color:#6b573b; text-align:center;}

    /* character */
    .visual_character .tit_area_center .tit {-webkit-transform: translate(-50%, -40%); -ms-transform: translate(-50%, -40%); transform: translate(-50%, -40%);}
    .section_character .grid {width:740px; margin:auto; padding:0;}

    /* character_sub */
    .visual_char {display:none;}
    .section_char .bg {display:none;}
    .section_char .h2 {display:none;}
    .section_char .bg_m {display:block;}

    /* illustration */
    .visual_illustration .tit_area_center .tit {-webkit-transform: translate(-50%, -40%); -ms-transform: translate(-50%, -40%); transform: translate(-50%, -40%);}
    .section_illustration .tab_con .con {margin:30px 0 0 0; text-align:center;}
    .section_illustration .tab_con .con img {width:100%;}

    /* contact */
    .section_contact.contact {padding:10% 0 15%;}
    .section_contact.contact .h2 .tit {margin-bottom:10px;}
    .section_contact.contact .h3 {width:60px; height:60px; padding-bottom:40px;}
    .section_contact.map {padding:0;}
    .section_contact.send {padding:10% 0 15%;}
    .section_contact.send .h2 .tit {margin-bottom:10px;}
    .section_contact.send .send_form {width:95%;}
    .section_contact.send .send_form dd {width:100%;}

    /* magazine */
    .section_magazine .grid {width:804px; padding:0; margin:auto;}

    /* pop */
    .pop {width:100%; height:90%; margin-top:5px;}
    .modal {background:#fff;}
        /* magazine */
    .pop_magazine .img_area {float:none; width:95%; height:50%; margin:auto; background:none; line-height:initial;}
    .pop_magazine .img_area div {height:100%; position:relative;}
    .pop_magazine .img_area img {position:absolute; top:0; left:0; right:0; bottom:0; width:auto; height:auto; max-width:100%; max-height:100%; margin:auto;}
    .pop_magazine .img_area .btn_slide {position:absolute; top:50%; width:19px; height:30px; margin-top:-15px;}
    .pop_magazine .img_area .btn_slide.left {left:0; background:url(../img/main/slide_left_m.png) no-repeat center; background-size:contain;}
    .pop_magazine .img_area .btn_slide.right {right:0; background:url(../img/main/slide_right_m.png) no-repeat center; background-size:contain;}
    .pop_magazine .txt_area {float:none; overflow-y:scroll; width:95%; height:50%; margin:auto; padding:20px 0px; background:none; -webkit-box-sizing:border-box; box-sizing:border-box;}
    .pop_magazine .close_pop {position:absolute; top:-22px; right:2.5%; width:19px; height:19px; background:url(../img/magazine/pop/close_pop_m.png) no-repeat center; background-size:contain;}
    .pop_illustration {margin-top:0; background:#fff;}
    .pop_illustration .pop_con {position:absolute; top:50%; width:100%; height:auto;  -webkit-transform:translate(0, -50%); -ms-transform:translate(0, -50%); transform:translate(0, -50%);}
    .pop_illustration img {max-width:100%; max-height:100%}
    .pop_illustration .btn_slide {top:50%; width:30px; height:30px; margin-top:-15px;}
    .pop_illustration .btn_slide.left {left:5px; background:url(../img/main/slide_left_m.png) no-repeat center; background-size:contain;}
    .pop_illustration .btn_slide.right {right:5px; background:url(../img/main/slide_right_m.png) no-repeat center; background-size:contain;}
    .pop_illustration .close_pop {position:absolute; top:-21px; right:2.5%; width:19px; height:19px; background:url(../img/magazine/pop/close_pop_m.png) no-repeat center; background-size:contain;}

}

@media all and (max-width:768px) {
    /* visual */
    .visual {height:50%;}
    .visual .tit_area {bottom:10%;}
    .visual .tit_area .tit {bottom:25px;}
    .visual .tit_area .sub_tit {font-size:12px;}
    .visual .tit_area .sub_tit {top:-15px;}
    .visual .tit_area_center .tit {width:60%;}

    /* section */
    .section .h2 {margin-bottom:35px !important;}
    .section .h2 .tit {height:auto; margin-bottom:5px; background:none !important; font-size:25px; font-weight:700; text-align:center; text-indent:0;}
    .section .h2 .tit::after {display:inline-block; width:30px; height:1px; margin-left:10px; background:#343434; vertical-align:middle; content:'';}
    .section .h2 .tit::before {display:inline-block; width:30px; height:1px; margin-right:10px; background:#343434; vertical-align:middle; content:'';}
    .section .h2 .sub_tit {font-size:14px;}

    /* main */
    .section_main .list_thumb {width:90%; margin:auto;}
    .section_main .list_thumb li {width:100%; margin:0 0 40px;}
    .section_main .list_thumb li:first-child {margin:0 0 40px;}
    .section_main .list_thumb li img {width:100%; height:auto; margin-bottom:10px;}
    .section_main .list_thumb li span {font-size:16px;}
    .section_main .list_thumb li .name {margin-bottom:5px;}
    .section_main .btn_more {width:190px; height:46px; margin:30px auto 0;}

    /* about */
    .section_about.message img {width:100%;}
    .section_about.partners .grid li img {max-width:80%;}

    /* magazine */
    .section_magazine .grid {width:85%; margin:auto; padding:0;}
    .section_magazine .grid .grid_item {width:100%; margin:0;}
    .section_magazine .grid .grid_item img {max-width:100%; min-width:100%; margin-bottom:10px;}
    .section_magazine .grid .grid_item .txt .name {margin-bottom:10px;}
    .section_magazine .grid .grid_item .txt dd {font-size:14px;}
    .section_magazine .grid .grid_item .txt .date {margin-top:5px; font-size:14px;}

    /* business */
    .section_business .h2 .sub_tit {line-height:20px;}

    /* character */
    .section_character .h2 .sub_tit {line-height:20px;}

    /* contact */
     .section_contact.send .h2 .sub_tit {line-height:21px;}
     .section_contact.send .send_form dt {font-size:14px;}
     .section_contact.send .btn_submit {width:190px; height:46px; margin:30px auto 0;}
     .section_contact.map iframe {height:300px;}
    
}

@media all and (max-width:767px) {
    /* character */
    .section_character .grid {width:370px;}
}

@media all and (max-width:320px) {
    /* character */
    .section_character .grid {width:90%;}
    .section_character .grid .grid_item {width:100%; margin:0 0 30px 0;}
    .section_character .grid img {left:13px !important; max-width:90%;}
}