@charset "utf-8"; /*------------------------------------------------------------------- 2021 Ctype main -------------------------------------------------------------------*/ /*------------------------------------------------------------------- ## header -------------------------------------------------------------------*/ #header{position:relative; width:100%; height:165px;margin:0 auto; box-sizing:border-box; background-color:#fff;} .headerWrap{max-width:1400px; height:100%; margin:0 auto; background: url("../../image/front/main/hangeul01.png") right top no-repeat;} .logoArea{position:relative; float:left;} .logoArea h1 a{display:inline-block; width:190px; background: url("../../image/front/main/logo_btype.png") left 20px no-repeat; padding:30px 0 0 0;} .logoArea h1 a.logoCanada{display:inline-block; width:190px; background: url("../../image/front/main/logo_btype_ca.png") left 20px no-repeat; padding:30px 0 0 0;} /* 20240724 캐나다 로고 추가 */ .logoSub{display:block; width:100%; float:left; border:solid 1px #484848; border-radius:3px; padding:3px 10px; text-align:center; box-sizing:border-box; background-color:#fff;} .logoSub li{display:inline-block; font-size:14px; } .logoSub li.logotxt01{color:#161e2a;} .logoSub li.logotxt01:after{content:""; position:relative; display:inline-block; top:1px; height:12px; border-right:solid 1px #161e2a; margin-left:10px;} .logoSub li.logotxt02{color:#161e2a; padding-left:8px;} .nav{display:inline-block; width:calc(100% - 420px); height:100%; margin:0 auto; text-align:center;} /* 20230217 width 수정 */ .nav ul{display:inline-block;min-width: 660px;} /* .nav ul{display:inline-block; min-width: 660px;} 20230214 기존 백업 */ .nav ul{display: flex !important; justify-content: center; min-width: 660px; text-align: center !important;} /* 20230214 수정 */ .nav li.depth01{display:table; float:left; height:110px;} /* .nav li.depth01Center{position:relative;} 20220405 추가, 20230216 삭제 */ /* .nav li.depth01 a.depth01Txt{position:relative; display:table-cell; text-align:center; font-size:18px; color:#444; padding:0 30px; vertical-align:middle; font-weight:300;} 20230217 기존 백업 */ .nav li.depth01 a.depth01Txt{position:relative; display: flex; justify-content: center; flex-direction: column; height: 110px; text-align:center; font-size:18px; color:#444; padding:0 30px; vertical-align:middle; font-weight:300;} /* 20230217 기존 백업 */ .nav li.depth01 a.depth01Txt:before{content:""; position:absolute; right:50%; bottom:0; width:0; height:4px; background:#000; transition: all 0.3s ease-in-out;} .nav li.depth01 a.depth01Txt:after{content:""; position:absolute; left:50%; bottom:0; width:0; height:4px; background:#000; transition: all 0.3s ease-in-out;} .nav li.depth01 a.depth01Txt:hover:before {width:40%;} .nav li.depth01 a.depth01Txt:hover:after {width:40%;} .nav li.depth01 .navSub{display:none; position:absolute; left:0; top:110px; width:100%;} .nav li.depth01.on a.depth01Txt{color:#000;} .nav li.depth01.on a.depth01Txt:before{content:""; position:absolute; right:50%; bottom:0; width:0; height:4px; background:#000; transition: all 0.3s ease-in-out;} .nav li.depth01.on a.depth01Txt:after{content:""; position:absolute; left:50%; bottom:0; width:0; height:4px; background:#000; transition: all 0.3s ease-in-out;} .nav li.depth01.on a.depth01Txt:before {width:40%;} .nav li.depth01.on a.depth01Txt:after {width:40%;} .nav li.depth01.on .navSub{display: block;position:absolute; left:0; top:110px; width:100%; border-top:solid 0px #989898; } /* .nav li.depth01Center.on .navSub{left:50%; width:calc(100% + 400px); margin-left:calc(-50% - 200px); } 20220405 추가01 */ .nav li.depth01Center.on .navSub{left:50%; width:auto; transform: translateX(-50%); } /* 20220405 추가 */ .nav li.depth01.on .navSub ul{position:relative; margin:0 auto; max-width: none;} /* 20230217 max-width 추가 */ /* .nav li.depth01Center.on .navSub ul{min-width: auto;} 20220405 추가01 */ .nav li.depth01Center.on .navSub ul{min-width: 1100px;} /* 20220405 추가02 */ .nav li.depth01.on .navSub ul li{display:inline-block; padding:0 20px; line-height:55px; margin-bottom:10px;} .nav li.depth01Center.on .navSub ul li{width: auto;} /* 20220405 추가 */ .nav li.depth01.on .navSub ul li a{font-size:16px; color:#6c6c6c;} .nav li.depth01.on .navSub ul li a:hover{color:#000;} /* 20230216 삭제: gnb 2depth 정렬 .nav li:nth-child(1) > div > ul{width:700px; text-align:left;} .nav li:nth-child(2) > div > ul{width:700px; text-align:left;} .nav li:nth-child(3) > div > ul{} .nav li:nth-child(4) > div > ul{width:700px; text-align:right;} .nav li:nth-child(5) > div > ul{width:700px; text-align:right;} */ /* menu 3 item */ /* .nav ul li:first-child:nth-last-child(3),.nav ul li:first-child:nth-last-child(3) ~ li {margin:0 4%;} */ /* 20211001 수정 */ .nav > ul > li:first-child:nth-last-child(3),.nav > ul > li:first-child:nth-last-child(3) ~ li {margin:0 1%;} /* menu 4 item */ .nav > ul > li:first-child:nth-last-child(4),.nav > ul > li:first-child:nth-last-child(4) ~ li {margin:0 2%;} /* menu 5 item */ .nav > ul > li:first-child:nth-last-child(5),.nav > ul > li:first-child:nth-last-child(5) ~ li {margin:0;} /* 20211001 수정 */ /* 20230127 gnb 간격 수정 start */ @media screen and (max-width: 1400px) { .nav li.depth01 a.depth01Txt {padding: 0 20px;} /* 20230217 추가 */ } @media screen and (max-width: 1300px) { .nav li.depth01 a.depth01Txt {font-size: 16px;} /* 20230217 추가 */ .nav li.depth01.on .navSub ul li {padding: 0 15px;} /* 20230217 추가 */ } @media screen and (max-width: 1220px) { .nav li.depth01.on .navSub ul li a {font-size: 15px;} /* 20230217 추가 */ } @media screen and (max-width: 1150px) { .nav li.depth01 a.depth01Txt {font-size: 15px;} /* 20230217 추가 */ .nav li.depth01.on .navSub ul li{padding: 0 10px; font-size: 15px;} /* 20230217 추가 */ } @media screen and (max-width: 1100px) { .nav li.depth01.on .navSub ul li a {font-size: 14px;} } /* 20230127 gnb 간격 수정 end */ .multiLink{float:right; margin-top:38px;} .multiLink > div{float:left; margin-left:20px;} .multiLink > div:first-child{margin-left:0px;} .langForm{position:relative; height:30px; z-index:100;} .langForm .btnLang{overflow:hidden; position:relative; display:block; width:100%; text-align:left; height:100%; padding:0 30px 0 0; font-size:16px; line-height: 30px; color:#585856; -webkit-transition: all 0.3s; transition: all 0.3s;} .langForm .btnLang:focus{outline: none;} .langForm .btnLang::after {content: ''; display:inline-block; position:absolute; width:8px; height:8px; border-top:2px solid #121212; border-right:2px solid #121212; top:9px; right:5px; transform: rotate(135deg); transition: all 0.3s;} /* .langForm > ul {display:none; position:absolute; top:35px; right:-5px; padding-bottom: 3px; z-index:10; width:85px; background-color:#fff; border: 1px solid #e8e8e8; -webkit-transition: background-color 0.3s; transition: background-color 0.3s;} */ .langForm > ul {display:none; position:absolute; top:35px; padding-bottom: 3px; z-index:10; width:140px; background-color:#fff; border: 1px solid #e8e8e8; -webkit-transition: background-color 0.3s; transition: background-color 0.3s;} .langForm > ul > li{padding:5px 0;} .langForm > ul > li:first-child{padding-top:8px;} .langForm > ul > li > a{display:block; padding:0 10px; font-size:14px; line-height:20px; color:#585856; } .langForm.open{border-bottom:none;} /* .langForm.open > ul {display:block;} */ .langForm.open .btnLang::after{transform:rotate(315deg); top:13px;} .snsForm{position:relative;} .snsForm .btnSns{overflow:hidden; position:relative; display:block; width:100%; text-align:left; height:100%; padding:0 30px 0 0; font-size:16px; line-height: 30px; color:#585856; -webkit-transition: all 0.3s; transition: all 0.3s;} .snsForm .btnSns::after {content: ''; display:inline-block; position:absolute; width:8px; height:8px; border-top:2px solid #121212; border-right:2px solid #121212; top:9px; right:5px; transform: rotate(135deg); transition: all 0.3s;} .snsForm.open .btnSns::after{transform:rotate(315deg); top:13px;} .snsForm > ul {display:none; position:absolute; top:45px; left:50%; padding-bottom: 3px; z-index:10; width:110px; background-color:#fff; border: 1px solid #e8e8e8; -webkit-transition: background-color 0.3s; transition: background-color 0.3s; transform:translatex(-50%);} .snsForm > ul > li{padding:5px 0 5px 7px;} .snsForm > ul > li:first-child{padding-top:8px;} .snsForm > ul > li > a{display:block; padding:0 10px 0 25px; font-size:14px; line-height:20px; color:#585856;} .snsForm > ul > li > a:hover{color:#222;} .snsForm > ul > li > a.snsfacebook{background:url("../../image/front/new/icon_facebook_active.png") left center no-repeat;} .snsForm > ul > li > a.snsfacebook:hover{background:url("../../image/front/new/icon_facebook_on.png") left center no-repeat;} .snsForm > ul > li > a.snsyoutube{background:url("../../image/front/new/icon_youtube_active.png") left center no-repeat;} .snsForm > ul > li > a.snsyoutube:hover{background:url("../../image/front/new/icon_youtube_on.png") left center no-repeat;} .snsForm > ul > li > a.snsinstagram{background:url("../../image/front/new/icon_instagram_active.png") left center no-repeat;} .snsForm > ul > li > a.snsinstagram:hover{background:url("../../image/front/new/icon_instagram_on.png") left center no-repeat;} .snsForm > ul > li > a.snsblog{background:url("../../image/front/new/icon_blog_active.png") left center no-repeat;} .snsForm > ul > li > a.snsblog:hover{background:url("../../image/front/new/icon_blog_on.png") left center no-repeat;} .snsForm > ul > li > a.snsflickr{background:url("../../image/front/new/icon_flickr_active.png") left center no-repeat;} .snsForm > ul > li > a.snsflickr:hover{background:url("../../image/front/new/icon_flickr_on.png") left center no-repeat;} .snsForm > ul > li > a.snstwitter{background:url("../../image/front/new/icon_twitter_active.png") left center no-repeat;} .snsForm > ul > li > a.snstwitter:hover{background:url("../../image/front/new/icon_twitter_on.png") left center no-repeat;} .snsForm > ul > li > a.snsvkontakte{background:url("../../image/front/new/icon_vk_active.png") left center no-repeat;} .snsForm > ul > li > a.snsvkontakte:hover{background:url("../../image/front/new/icon_vk_on.png") left center no-repeat;} .snsForm > ul > li > a.snsweibo{background:url("../../image/front/new/icon_weibo_active.png") left center no-repeat;} .snsForm > ul > li > a.snsweibo:hover{background:url("../../image/front/new/icon_weibo_on.png") left center no-repeat;} .snsForm > ul > li > a.snskoo{background:url("../../image/front/new/icon_koo_active.png") left center no-repeat;} .snsForm > ul > li > a.snskoo:hover{background:url("../../image/front/new/icon_koo_on.png") left center no-repeat;} /* .snsForm.open > ul {display:block;} */ .searchForm{} .btnSearch{overflow:hidden; position:relative; display:block; width:100%; text-align:left; height:100%; padding:0 30px 0 0; font-size:16px; line-height: 30px; color:#585856; -webkit-transition: all 0.3s; transition: all 0.3s; background:url("../../image/front/main/icon_tnb_searchC.png") right center no-repeat;} /* .searchForm .searchBoxHeader {display:none;} */ .gnb_wrapper .gnb_wrap .gnbBox .multiLink ul li.searchForm .searchBoxHeader {display:none;} .search-mobile .mobilesearchBoxHeader{display:none; position:absolute; top:100px; left:0; width:100%;} .search-mobile .mobilesearchBoxHeader .searchBox-area{position:absolute; width:60%; top:0; left:50%; transform:translateX(-50%);} .search-mobile.open .btnSearch{background:#1860a0 url("../../image/front/main/icon_tnb_searchClose.png") center center no-repeat;} .search-mobile.open .mobilesearchBoxHeader .searchBox-bg{background-color:#000; height:60px; opacity:0.7;} .search-mobile.open .mobilesearchBoxHeader .searchBox-bg{width:100%;} .search-mobile.open .mobilesearchBoxHeader .searchBox-area{position:absolute; width:60%; top:0; left:50%; transform:translateX(-50%);} .searchForm .searchBoxHeader{display:none; position:absolute; top:110px; left:0; width:100%;} .searchForm .searchBoxHeader .searchBox-area{position:absolute; width:60%; top:0; left:50%; transform:translateX(-50%);} .searchForm.open .btnSearch{background:url("../../image/front/main/icon_tnb_searchCloseC.png") right center no-repeat;} .searchForm.open .searchBoxHeader .searchBox-bg{background-color:#fff; height:200px; opacity:1;} .searchForm.open .searchBoxHeader .searchBox-bg{width:100%;} .searchForm.open .searchBoxHeader .searchBox-area{position:absolute; width:80%; top:50%; left:50%; transform: translateX(-50%) translateY(-50%);} /* .searchBox-area::after{content:''; position:absolute; left:0; bottom:0; width:0; height:2px; background:#eb912a; transition:width .3s;} */ .searchBox-area input{ display:block; width:100%; padding: 15px 35px 9px 10px; background:transparent; border-bottom:2px solid #333; color:#333; font-weight:500; outline:none; -webkit-appearance: none; -webkit-border-radius: 0;box-sizing: border-box; } .searchBox-area input::placeholder{color:#aaa !important; font-size:16px;} .searchBox-area input::-webkit-input-placeholder{color:#aaa; font-size:16px;} /* 크롬 구버전 */ .searchBox-area input:-ms-input-placeholder{color:#aaa; font-size:16px;} /* IE적용 */ .searchBox-area button.btn-submit{position:absolute; display:block; top:50%; right:0px; width:24px; height:24px; text-indent:-999em; overflow:hidden; transform:translateY(-50%); background:url("../../image/front/main/icon_searchC.png") center center no-repeat;} .webAllMenu{display:none;} .pc .mb-group {display: block !important;right: auto !important;} .pc .searchForm .searchBoxHeader {z-index: 99;} .pc #header {z-index: 99;} /* 언어별 css */ html:lang(ko) .logoSub li{font-weight: 200;} html:lang(ko) .langForm .btnLang{font-weight:200;} html:lang(ko) .snsForm .btnSns{font-weight:200;} html:lang(ko) .searchForm .btnSearch{font-weight:200;} html:lang(ko) .nav li.depth01.on .navSub ul li a{font-weight:200;} html:lang(ko) .snsForm > ul > li > a{font-weight:200;} html:lang(ar) .nav li:nth-child(1) > div > ul{width:700px; text-align:left;} html:lang(ar) .nav li:nth-child(2) > div > ul{width:700px; text-align:left;} html:lang(ar) .nav li:nth-child(3) > div > ul{} html:lang(ar) .nav li:nth-child(4) > div > ul{width:700px; text-align:right;} html:lang(ar) .nav li:nth-child(5) > div > ul{width:700px; text-align:right;} /*------------------------------------------------------------------- ## mainvisual -------------------------------------------------------------------*/ #mainvisual{position:relative; width:100%; z-index:1;} /* main_slider */ .main_slider{position:relative;width:100%; max-width: 1400px; max-height: 420px; margin: auto; background:url("../../image/front/main/hangeul02.png") 20% bottom no-repeat;} .main_slider_Area{width:1400px; margin:0 auto;} .main_slider ul{clear:both;display:block} .main_slider > p{position:absolute;left:50%;top:0;width:50%;height:100%;} .bx-wrapper{margin:auto;width:1400px;} .visual{margin:auto; position:relative; width:100% !important; padding:0; box-sizing:border-box} .visual > div{position:relative; margin:0 auto;width:1400px} /* .visual figure:before{content:"";position:absolute;left:50%;top:0;width:50%;height:439px;background:rgba(0,110,205,0.7)} */ .visual > span{display:inline-block; box-sizing:border-box; transition:0.3s; float:right;width: 65%;text-align: right;} .visual > span img{width:100%; height:auto; border:solid 1px #e4e4e4; box-sizing:border-box;max-height: 420px; max-width:900px; float:right;} .visual .visualText{position:relative; display:inline-block; width:35%; height:100%; box-sizing:border-box; transition:0.3s; padding-right:20px;} .visual .title{display:-webkit-box;display: -ms-flexbox;width:100%; max-height: 115px; font-weight:700; font-size:38px;color:#2c2c2d;word-break:keep-all;word-wrap:break-word;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;white-space:normal; word-wrap:break-word;text-align:left;line-height:60px;-webkit-line-clamp:2;-webkit-box-orient:vertical;-ms-flex-direction: column;letter-spacing:normal;transition:0.3s} .visual > div a{display:inline-block; position:absolute; top:170px; padding:0 23px 8px 5px; font-size:17px; color:#585859; transition:0.3s; background: url("../../image/front/main/icon_mv_arrowC.png") right bottom no-repeat;} .pagerCustom{margin:0 auto;position:relative;max-width:1400px;width: 100%;} .pagerCustom p{z-index:1;position:absolute;right:0;bottom:40px} .pagerCustom p span{float:left;position:relative;margin-left:20px;transition:0.3s} .pagerCustom p span a{display:block} .pagerCustom p span a:before{content:"";position:absolute;left:0;top:0;width:100px;height:64px;background:rgba(0,0,0,0.2)} .pagerCustom p span a.active:before{background:rgba(0,0,0,0.0)} .pagerCustom p span a img{width:100px;height:64px;border:1px solid #328de1;box-shadow:4px 4px rgba(0,0,0,0.3);box-sizing:border-box} .progress{margin:0 auto;position:relative;right:0;width:1400px;} .progress p{position:absolute;overflow:hidden;right:65px;top:-12px;width:123px;height:1px;background:#999189} .progress p span{display:block;max-width:0;min-width:30px;height:1px;background:#fff;transition:0.75s} .main_slider .bx-viewport{padding-bottom:0px;} .main_slider .bx-controls{position:absolute; bottom:80px; left:0; transform:translateY(-50%); text-indent:-99999px; z-index:1; margin:0 auto;} .main_slider .bx-controls-direction{position:absolute; left:0px; top: 50%; transform: translateY(-50%); width:115px; height:56px; transition:0.3s} .main_slider .bx-controls-direction .bx-prev{ display:inline-block; position:absolute; left:0; padding:19px 15px;line-height: 1; background:url("../../image/front/main/btn_prevC.png") left center no-repeat } .main_slider .bx-controls-direction .bx-next{ display:inline-block; position:absolute; right:0px; padding:19px 15px;line-height: 1; background:url("../../image/front/main/btn_nextC.png") right center no-repeat } .main_slider .bx-controls-direction .bx-prev:hover, .main_slider .bx-controls-direction .bx-prev:focus, .main_slider .bx-controls-direction .bx-next:hover, .main_slider .bx-controls-direction .bx-next:focus{opacity:0.85;-fileter:alpha(opacity=85)} #slide-counter {position:absolute; bottom:0; left:0;transform: translateY(-50%); padding:2px 0 2px 35px; transition:0.3s;color: #7c7c7c;font-weight: 500;letter-spacing: 2px; font-size:16px; font-family:'RobotoL';} #slide-counter strong {position:absolute; top:-8px; left:0;color: #3b3b3b; font-weight:bold; font-size:25px;} .counterLine{left:20px !important;} .main_slider .bx-controls-auto{position: absolute; left:32px; top:50%; transition: 0.3s;transform: translateY(-50%);transition:0.3s} .main_slider .bx-controls-auto .bx-start {display:block;width: 50px; background:url("../../image/front/main/btn_playC.png") center center no-repeat} .main_slider .bx-controls-auto a.bx-stop {display:block;width: 50px;background:url("../../image/front/main/btn_pauseC.png") center center no-repeat} .main_slider .bx-controls-auto .active {display: block;} .main_slider .bx-controls-auto .bx-controls-auto-item a.active {display: none;} .main_slider .bx-controls-auto .bx-controls-auto-item a {display: block;} .bx-controls > .bx-default-pager {padding: 2px 24px;position:absolute; right:76px; top:-25px; border:solid 1px #fff; transition:0.3s;font-size: 0;} .bx-controls > .bx-pager > .bx-pager-item {position: relative !important;right: auto;top: auto;left: auto;bottom: auto; width: 10px; display: inline-block;text-indent: 0;} .main_slider .bx-pager .bx-pager-item a {font-size: 20px;} .main_slider .bx-controls-auto a.bx-start img{position:absolute; left:20px; top:50%; transform:translateY(-50%); background:url("../../image/front/main/btn_play.png") center center no-repeat} .main_slider .bx-controls-auto a.bx-stop img{position:absolute; left:20px; top:50%; transform:translateY(-50%); background:url("../../image/front/main/btn_pause.png") center center no-repeat} .main_slider .bx-controls-direction .bx-prev:focus img, .main_slider .bx-controls-direction .bx-next:focus img, .main_slider .bx-controls-auto a.bx-start:focus img, .main_slider .bx-controls-auto a.bx-stop:focus img{box-sizing:border-box;outline:1px dotted #ccc} .main_slider .bx-controls-auto a.bx-start:hover, .main_slider .bx-controls-auto a.bx-start:focus, .main_slider .bx-controls-auto a.bx-stop:hover, .main_slider .bx-controls-auto a.bx-stop:focus{opacity:0.85;-fileter:alpha(opacity=85)} /* .main_slider .bx-controls-auto a.active{display:none} */ .noticePaging{position:absolute; right:95px; top:269px; font-family:"RobotoL"; font-size:16px; color:#fff;} .noticePaging .noticeCount{font-family:"RobotoB";} .noticePaging noticeTotal{} /* 언어별 css */ html:lang(ko) .visual .title{font-weight: 700;} html:lang(ko) .visual > div a{font-weight: 200;} /*------------------------------------------------------------------- ## container -------------------------------------------------------------------*/ #container{position:relative; width:100%; margin:0 auto;} /* galleryNews */ .galleryNews{ margin:0 auto; position:relative; max-width: 960px; padding:90px 0 40px 0; width:calc(100% - 440px);} /* 사파리 브라우저 수정 20221005 */ .galleryNews .tab_content > p{display:block; position:absolute; top:-60px; right:0; text-align:center; padding-top:10px;} .galleryNews .tab_content > p a{display:block; transition:0.5s; padding-right:30px;} .galleryNews .tab_content > p a::after {content: ''; display:inline-block; position:absolute; width:20px; height:4px; top:20px; right:0px; background-color:#000;} .galleryNews .tab_content > ul{ margin-top:25px;width: 100%;height: 100%;display: -webkit-box;display: -ms-flexbox;-webkit-box-orient: horizontal;-ms-flex-direction: row;display: -moz-box;-moz-box-orient: horizontal; display: box;box-orient: horizontal; } .galleryNews .tab_content > ul > li{position:relative;width: 100%;overflow:hidden; display: block;-webkit-box-flex: 1;-ms-flex: 1;-moz-box-flex: 1;box-flex: 1;text-align: center;} .galleryNews .tab_content > ul > li + li {margin-left: 52px;} .galleryNews .tab_content > ul > li:last-child{margin-right:0; display: none;} .galleryNews .tab_content > ul > li a.galleryImg{display:block; width: 100%;} /* 20221219 'max-width:320px' 삭제: 콘텐츠 갯수 3개 이하일때 */ .galleryNews .tab_content > ul > li a.galleryImg .galleryThumb{position:relative; overflow:hidden;} .galleryNews .tab_content > ul > li a.galleryImg img{width:100%; height:260px; transform:scale(1.0); transition:0.5s;box-sizing:border-box;object-fit:cover; border:solid 1px #d0d0d0;} .galleryImg .galleryTxt{display:none;} .galleryImg:hover .galleryThumb::after{content:""; position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.7); z-index:10;} .galleryImg:hover .galleryTxt{position:absolute; top:20px; left:10px; display:block; z-index:20;} .galleryNews .tab_content .galleryTxt{position: absolute;left: 0;right: 0;top: 0;bottom: 30px;text-align:left; margin-top:20px; padding:0;} .galleryNews .tab_content .galleryTxt .gallerySubtxt{ font-size:16px; color:#fff; margin-bottom:25px; display:inline-block; display:-webkit-box;display: -ms-flexbox; width:95%; height:3.1em; white-space:nowrap; overflow:hidden;text-align: left; text-overflow:ellipsis; white-space:normal; word-wrap:break-word; line-height:1.7; -webkit-line-clamp:2; -webkit-box-orient:vertical;-ms-flex-direction: column; font-weight:500; padding-left:15px; box-sizing: border-box; } .galleryTit{font-size:17px; color:#4c4c4c; margin:15px 0 0 0; overflow:hidden; width:100%; white-space:nowrap; text-overflow:ellipsis; font-weight:500; text-align:left;} .galleryNews .tab_content .galleryTxt .btnGallery{position: absolute;right: 20px;bottom: 30px; display:inline-block; color:#fff; font-size:14px;padding-right: 10px;} .galleryNews .tab_content .galleryTxt .btnGallery::after {content: ''; display:inline-block; position:absolute; width:8px; height:8px; border-top:2px solid #fff; border-right:2px solid #fff; top:6px; left:70px; transform: rotate(45deg); /* 반대각도 315deg 135deg 225deg */} .galleryNews > div.tabs {overflow: hidden;padding: 0px 0px 5px 0px;} .tabs button {display:inline-block; position:relative; font-size:20px; color:#a5a5a5; text-align:center; margin-right:60px; transition:0.3s; font-weight:500; letter-spacing:-0.05em; line-height:1; vertical-align:bottom;} .tabs button.active{color:#141414; font-size:23px; font-weight:700;} .tabs02 button {display:inline-block; position:relative; font-size:20px; color:#a5a5a5; text-align:center; margin-right:60px; transition:0.3s; font-weight:500; letter-spacing:-0.05em; line-height:1; vertical-align:bottom;} .tabs02 button.active{color:#141414; font-size:23px; font-weight:700;} .wrap_cons .cons {position: relative;} .wrap_cons02 .cons02 {position: relative;} .flex-box { width: 100%;height: 100%;max-width: 1400px;margin: auto; display: -webkit-box;display: -ms-flexbox;-webkit-box-orient: horizontal;-ms-flex-direction: row;display: -moz-box;-moz-box-orient: horizontal;display: box;box-orient: horizontal; display: flex; } .flex-box > div {display: block;-webkit-box-flex: 1;-ms-flex: 1;-moz-box-flex: 1;box-flex: 1;text-align: left;} .flex-box > .cultural-info {-webkit-box-flex: 0;-moz-box-flex: 0;box-flex: 0;margin-left: 70px;width: 100%;max-width: 370px;padding: 90px 0 40px 0;} .cultural-info h3 {padding-bottom: 20px; color:#141414; font-size:22px; font-weight:700;} .cultural-info .cultural { padding: 30px 25px; height: calc(100% - 67px); box-sizing: border-box; background:url("../../image/front/main/cultural_bg.png") center center no-repeat;background-size: cover; } .cultural-info .cultural dl dt {padding-bottom: 20px; color:#dadada; font-size:17px; font-weight:100;line-height: 1;} .cultural-info .cultural dl dd {color:#fff; font-size:17px; font-weight:300;line-height: 1.5;} .cultural-info .cultural dl dd + dd {padding-top: 10px;} .cultural-info .cultural dl + dl {padding-top: 40px;} .notice > div.tabs {overflow: hidden; height:28px;text-align: left;} .notice .tabs button { display:inline-block; position:relative; font-size:20px; color:#a5a5a5; text-align:center; margin-right:60px; transition:0.3s; font-weight:500; letter-spacing:-0.05em; line-height:1; vertical-align:bottom; height: 30px; } .notice .tabs button.active{color:#141414; font-size:23px; font-weight:700; height: 30px;} .notice {position:relative; max-width:100%; width: 1400px; padding:20px 0 60px 0;} /* 20221219 'width: 1400px' 추가: 콘텐츠 갯수 3개 이하일때 */ .notice .tab_content > p{display:block; position:absolute; top:-60px; right:0; text-align:center; padding-top:10px;} .notice .tab_content > p a{display:block; transition:0.5s; padding-right:30px;} .notice .tab_content > p a::after {content: ''; display:inline-block; position:absolute; width:20px; height:4px; top:20px; right:0px; background-color:#000;} .notice .tab_content > ul{margin-top:30px;width: 100%;height: 100%;display: -webkit-box;display: -ms-flexbox;-webkit-box-orient: horizontal;display: -moz-box;-moz-box-orient: horizontal; display: box;box-orient: horizontal;} .notice .tab_content > ul > li{position:relative;width: 100%;overflow:hidden; display: block;-webkit-box-flex: 1;-ms-flex: 1;-moz-box-flex: 1;box-flex: 1;text-align: center;} .notice .tab_content > ul > li + li {margin-left: 30px;} .notice .tab_content > ul > li {padding: 30px 20px; border: 1px solid #c5c5c5;text-align: left;} .notice .tab_content > ul > li:hover {border: 1px solid #000;} .tab_content .title { display: block;color: #555;font-size: 17px;line-height: 1.6;white-space: nowrap; overflow: hidden; text-overflow: ellipsis;white-space: normal; max-height: 52px; text-align: left; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;-ms-flex-direction: column;min-height: 52px; } .tab_content .date {display: block;padding: 32px 0 20px; color: #8a8a8a;font-size: 16px;font-weight: 100; height: 24px;} .tab_content .detail {display: inline-block;padding: 7px 28px;color: #454444;font-size: 16px;font-weight: 100;border: 1px solid #5c5c5c;} @media screen and (max-width: 1400px) { .galleryNews .tabs button{margin-right:25px; font-size: 18px;} .galleryNews .tabs button.active{font-size: 22px;} .notice .tabs button{margin-right:25px; font-size: 18px;} .notice .tabs button.active{font-size: 22px;} } /* 20230221 추가 */ @media screen and (max-width: 1250px) { .galleryNews > div.tabs {width: 70%;} } /* 20230221 추가 */ .hallyuwrap {width: 100%;height: 100%;max-width: 1400px;margin: auto;padding-bottom: 60px;} .hallyuwrap .hall_img {width: 100%;height: 100%;} .hallyuwrap .hall_img img {width: 100%;height: 100%;max-height: 200px;} /* 20230424 백업 start .hallyu_banner {padding: 20px 0 0 0;} .hallyu_banner ul { width: 100%;height: 100%;display: -webkit-box;display: -ms-flexbox;-webkit-box-orient: horizontal;-ms-flex-direction: row;display: -moz-box;-moz-box-orient: horizontal; display: box;box-orient: horizontal; } .hallyu_banner ul li { position:relative;width: 100%;overflow:hidden; display: block;-webkit-box-flex: 1;-ms-flex: 1;-moz-box-flex: 1;box-flex: 1;text-align: center;padding-top: 60px; } .hallyu_banner ul li.banner01 {background: url("../../image/front/main/banner01_img.png") center top no-repeat;background-size: 55px;} .hallyu_banner ul li.banner02 {background: url("../../image/front/main/banner02_img.png") center top no-repeat;background-size: 105px;} .hallyu_banner ul li.banner03 {background: url("../../image/front/main/banner03_img.png") center top no-repeat;background-size: 65px;} .hallyu_banner ul li h4 {color: #000;font-size: 22px;font-weight: 300;line-height: 1;} .hallyu_banner ul li .txt {padding: 35px 0 15px; color: #888;font-size: 16px;font-weight: 100;line-height: 1;} .hallyu_banner ul li a { padding-right: 30px; color: #000;font-size: 16px;font-weight: 100;line-height: 14px;background: url("../../image/front/main/more.png") right center no-repeat;background-size: 8px; } 20230424 백업 end */ /* 20230424 온라인 문화원 삭제 start */ .hallyu_banner {position: relative; margin-top: 30px; border: solid 1px #ddd; padding: 20px 0; box-sizing: border-box;} .hallyu_banner::after{content: ''; position: absolute; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%); width: 1px; height: 50%; background-color: #ccc;} .hallyu_banner ul {width: 100%;height: 100%;display: -webkit-box;display: -ms-flexbox;-webkit-box-orient: horizontal;-ms-flex-direction: row;display: -moz-box;-moz-box-orient: horizontal; display: box;box-orient: horizontal;} .hallyu_banner ul li {position:relative;width: 100%;overflow:hidden; display: block;-webkit-box-flex: 1;-ms-flex: 1;-moz-box-flex: 1;box-flex: 1;text-align: left; padding: 0 30px; box-sizing: border-box;} .hallyu_banner ul li.banner01 {background: url("../../image/front/main/banner0101_img.png") right 30px center no-repeat;} .hallyu_banner ul li.banner02 {background: url("../../image/front/main/banner0202_img.png") right 30px center no-repeat;} .hallyu_banner ul li h4 {color: #000;font-size: 22px;font-weight: 300;line-height: 1; width: calc(100% - 85px);} .hallyu_banner ul li .txt {padding: 15px 0; color: #888;font-size: 16px; font-weight: 100; width: calc(100% - 85px); line-height: 22px;} .hallyu_banner ul li a {padding-right: 30px; color: #000;font-size: 16px;font-weight: 100;line-height: 14px;background: url("../../image/front/main/more.png") right center no-repeat;background-size: 8px;} html:lang(ar) .hallyu_banner ul li{text-align: right;} html:lang(ar) .hallyu_banner ul li.banner01 {background: url("../../image/front/main/banner0101_img.png") left 30px center no-repeat;} html:lang(ar) .hallyu_banner ul li.banner02 {background: url("../../image/front/main/banner0202_img.png") left 30px center no-repeat;} /* 20230424 온라인 문화원 삭제 end */ .hallyu_bbs {position: relative;display: block;width: 100%;overflow: hidden;margin-top: 35px;} .hallyu_bbs ul { width: 100%;height: 100%;display: -webkit-box;display: -ms-flexbox;-webkit-box-orient: horizontal;-ms-flex-direction: row;display: -moz-box;-moz-box-orient: horizontal;display: box;box-orient: horizontal; } .hallyu_bbs ul li {width: 100%;overflow:hidden; display: block;-webkit-box-flex: 1;-ms-flex: 1;-moz-box-flex: 1;box-flex: 1;text-align: center;} .hallyu_bbs ul li + li {margin-left: 100px;} .hallyu_bbs ul li a {position: relative;display: block;height: 170px; overflow: hidden;border: solid 1px #ddd;background-color: #fff;box-sizing: border-box;} .hallyu_bbs ul li a:hover {border: solid 1px #555;} .hallyu_bbs ul li a span {display: inline-block;float: left;width: 50%;} /* kdy - start */ .hallyu_bbs ul li a img {width: 100%;height: 168px;object-fit: cover;} /* .hallyu_bbs ul li a img {float: left;width: 298px;height: 168px;object-fit: cover;} */ /* kdy - end */ .hallyu_bbs ul li a dl {display: inline-block;width: 50%;padding: 20px 30px 0;box-sizing: border-box;} .hallyu_bbs ul li a dl dt { font-size: 17px;color: #4c4c4c;white-space: nowrap;overflow: hidden;text-overflow: ellipsis; font-weight: 700;text-align: left; line-height: 1.3; } /* 20230217 line-height 수정 */ .hallyu_bbs ul li a dl dd { margin-top: 19%; font-size: 16px; color: #6d6d6d; height: 3em; white-space: nowrap;overflow: hidden;text-overflow: ellipsis;white-space: normal; word-wrap: break-word;line-height: 1.5;-webkit-line-clamp: 2;-webkit-box-orient: vertical;-ms-flex-direction: column;display: -webkit-box;display: -ms-flexbox;font-weight: 300; } /* 20230217 line-height, height 수정 */ .Korea-net-k{float:left;width:100%;min-height:240px;height:100%;overflow:hidden;background:#003964;margin-right:10px;} .Korea-net-k h4{position:relative;padding: 10px 10px 8px 10px;color:#fff;text-align: center;} .Korea-net-k h4 span{font-size:19px;font-weight: 700;} .Korea-net-k h4 span.more {position: absolute;right: 15px;} .Korea-net-k .more a{color:#fff;display: block;width:80px;font-size: 14px;float: right;text-align: right;padding-top: 2px;} .Korea-net-k .Koreanet-box{position:relative;width:100%;overflow:hidden;height:186px;box-sizing: border-box;/*padding: 0 10px 10px 10px;*/ padding: 0 9px;} .Korea-net-k .Koreanet-box ul{height: 100%;box-sizing: border-box;padding: 10px 0;background: #fff;overflow: hidden;} .Korea-net-k.col4 .koreanet-box ul li{width: 25%;} .Korea-net-k .koreanet-box ul:after {content: '';display: block;clear: both;} .Korea-net-k .Koreanet-box ul li{position: relative; width: 25%;float: left;overflow: hidden;height: 100%;} .Korea-net-k .Koreanet-box ul li{padding:0 10px; box-sizing:border-box;} .Korea-net-k .Koreanet-box ul li a{display: inline-block;position: relative;box-sizing: border-box;height: 100%;margin: auto;max-width: 100%;padding-bottom: 13px;} .Korea-net-k .Koreanet-box ul li:first-of-type{padding-left: 10px;} .Korea-net-k.height3 .Koreanet-box ul li a .konet-txt{min-width: 100px;-webkit-line-clamp:2;height:38px;overflow: hidden;} .Korea-net-k .Koreanet-box li a .konet-img{max-height: 110px;overflow: hidden;display: block;padding: 0;text-align: center;} .Korea-net-k .Koreanet-box li a .konet-img img{width: auto;height: 125px;} .Korea-net-k .Koreanet-box li a span.konet-txt{display: block;padding-top: 5px;font-size: 15px;line-height: 18px;white-space: normal;text-overflow: ellipsis; overflow: hidden;text-align: left;word-wrap: break-word;display: -webkit-box;display: -ms-flexbox;-webkit-box-orient: vertical;-ms-flex-direction: column;min-width: 60px;margin: auto;color: #333;} .Korea-net-k .Koreanet-box li a span.date{position: absolute;white-space: nowrap;font-size:12px;color:#7f7f7f;bottom:-2px;left: 0;} .notice-Board { position: relative; font-size: 0; max-width: 1400px; margin: 0 auto 60px; overflow: hidden; width: 100%; height: 242px; display: -webkit-box; display: -ms-flexbox; -webkit-box-orient: horizontal; -ms-flex-direction: row; display: -moz-box; -moz-box-orient: horizontal; display: box; box-orient: horizontal; display: flex; /* 사파리 브라우저 수정 20221005 */ } .notice-Board .koreanet {width: 100%;overflow: hidden;display: block;-webkit-box-flex: 1;-moz-box-flex: 1;-ms-flex: 1;box-flex: 1;text-align: center;} .notice-Board .notice-slider {position: relative;margin-left: 2%;max-width: 430px;width: 100%;display: block;-webkit-box-flex: 1;-moz-box-flex: 1;-ms-flex: 1;box-flex: 1; overflow:hidden;} .notice-slider .bx-controls {position: absolute;right: 15px;top: 0;} .notice-slider .bx-controls-direction{position:absolute; right:0px;top: 15px; width:160px; height:30px; transition:0.3s} .notice-slider .bx-controls-direction .bx-prev{ display:inline-block; position:absolute; left:0; border:solid 1px #fff; padding:4px 8px;line-height: 1;background: rgba(0, 0, 0, 0.5);border-radius: 3px; } .notice-slider .bx-controls-direction .bx-next{ display:inline-block; position:absolute; right:0px; border:solid 1px #fff;padding:4px 8px;line-height: 1;background: rgba(0, 0, 0, 0.5);border-radius: 3px; } .notice-slider .bx-controls-auto{ position: absolute;right: 40px;top: 15px;width: 80px;height: 30px; border: solid 1px #fff;transition: 0.3s;background: rgba(0, 0, 0, 0.5); border-radius: 3px;padding: 5px 12px;box-sizing: border-box; } .notice-slider .bx-controls-auto a.bx-start {display:block;width: 30px;} .notice-slider .bx-controls-auto a.bx-start img {width: 8px;margin-top: 2px;} .notice-slider .bx-controls-auto a.bx-stop {display:block;width: 30px;} .notice-slider .bx-controls-auto a.bx-stop img {width: 8px;margin-top: 2px;} .notice-slider .bx-controls-auto a.active {display: none;} .notice-slider .bx-controls-auto a {display: block;} #notice-counter {position:absolute; top: 15px; right: 62px;padding:2px 0; transition:0.3s;font-size: 16px; color: #fff;font-weight: 200;letter-spacing: 2px;z-index: 9;} #notice-counter strong {font-weight: 200;vertical-align: top;color: #fff;font-size: 16px; } .bannerwrap {padding-bottom: 40px;} .banner-box { font-size: 0;max-width: 1400px;margin: auto;overflow: hidden;background:url("../../image/front/main/banner_bg.png") right center no-repeat;background-size: cover; } .banner_slider {position: relative; padding: 24px 0;} .banner_slider li a {display: block;padding: 10px 0;text-align: center;} .banner_slider li a span {display: inline; font-size: 15px; color: #fff;font-weight: 200;vertical-align: top;} /* 20230127 display: inline; 으로 변경: 아이콘정렬 */ .banner_slider li a span {padding-right: 20px; background:url("../../image/front/main/ico-windowC.png") right center no-repeat;background-size: 13px;} .banner_slider .bx-wrapper {margin: 0;} .banner_slider .bx-wrapper .bx-controls {position: absolute;right: 0;top: 50%;transform: translateY(-50%);} .banner_slider .bx-wrapper .bx-controls .bx-controls-direction {width:110px;height: 40px;position: absolute;right: 30px;top: 50%;transform: translateY(-50%);} .banner_slider .bx-wrapper .bx-controls .bx-controls-direction a.bx-prev {display: inline-block;position: absolute;left: 0;top: 17px; width: 30px;height: 40px;} .banner_slider .bx-wrapper .bx-controls .bx-controls-direction a.bx-next {display: inline-block;position: absolute;right: 0;top: 17px; width: 30px;height: 40px;} .banner_slider .bx-wrapper .bx-viewport ul::after {content: '';display: block;clear: both;} .banner_slider .bx-controls-auto a.active {display: none;} .banner_slider .bx-controls-auto a {display: block;} .banner_slider .bx-controls-auto {position: absolute;top: 50%;right: 77px;transform: translateY(-40%);width: 20px;height: 20px;} .newsletter { position: relative; font-size: 0;max-width: 1400px;margin: auto;padding-bottom: 120px; overflow: hidden; background:url("../../image/front/main/news_bg.png") 10px 40px no-repeat;background-size: 441px; } .newsletter h3 {position: relative;float: left; font-size: 25px;color: #111111;font-weight: 700;line-height: 1;} .newsletter h3::after {content: '';display: inline-block;position: absolute;left: 0;bottom: -15px; width: 50px;height: 3px;background-color: #000;} .newsletter .right {overflow: hidden;text-align: right;padding-left: 15%;} .newsletter .input-box { padding: 0 0 30px;display: -webkit-box;display: -ms-flexbox;-webkit-box-orient: horizontal;-ms-flex-direction: row;display: -moz-box;-moz-box-orient: horizontal;display: box;box-orient: horizontal; } .newsletter .input-box > * {display: block;-webkit-box-flex: 1;-ms-flex: 1;-moz-box-flex: 1;box-flex: 1;text-align: left;} .newsletter .input-box input { max-width: 400px;width: 50%; padding: 10px 20px 10px 20px; color: #222;font-size: 16px; font-weight: 100;line-height: 23px; border-bottom: 3px solid #111;-webkit-transition: all 0.30s ease-out; text-align: left;box-sizing: border-box; } .newsletter .input-box input::placeholder {color: #a7a7a7;font-weight: 100;} .newsletter .input-box input + input {margin-left: 80px;} .newsletter .btn-news { min-width: 150px;margin-left: 50px; padding: 15px 10px 14px; font-size: 16px;color: #fff;font-weight: 500;line-height: 1; background-color: #1361a6;text-align: center;vertical-align: top; } .newsletter .newsletter-agree {text-align: left;} label.check {display: inline-block;text-align: left;} label.check input[type="checkbox"] { width: 24px;height: 24px;min-height: 24px;padding: 0;vertical-align: middle;-webkit-transition: all .5s;transition: all .5s;border: 1px solid #ddd;border-radius: 2px; } label.check input[type="checkbox"]:checked { border: 1px solid #ddd; -webkit-transition: all .5s;transition: all .5s; } label.check span {display: inline-block;padding-left: 5px;color: #404040;font-size: 15px;text-align: left;font-weight: 200;line-height: 24px;} .newsletter .btn-detail {margin: 0 0 0 30px;font-size: 15px; color: #c0205f;text-decoration: underline;font-weight: 200;vertical-align: top;background: transparent;} /* 언어별 css */ /* 한국어 */ html:lang(ko) .tab > ul > li > a{font-weight:700; letter-spacing:normal} html:lang(ko) .galleryNews .tab_content > ul > li dl dt{ font-weight:500;} html:lang(ko) .galleryNews .tab_content > ul > li dl dd{ font-weight:200;} html:lang(ko) .galleryNews .tab_content > ul > li a.galleryBtn{font-weight:200;} html:lang(ko) .infoArea h1{width:130px; font-weight:700;} html:lang(ko) .infoArea .infoTxt dl dt{font-weight:200;} html:lang(ko) .infoArea .infoTxt dl dd{font-weight:300;} html:lang(ko) .noticeArea h1{ font-weight:700;} html:lang(ko) .noticeArea ul li a p.date{font-weight: 100;} html:lang(ko) .hallyuArea h1{ font-weight:700;} html:lang(ko) .hallyuBbs ul li a dl dt{font-weight:500;} html:lang(ko) .hallyuBbs ul li a dl dd{ font-weight: 100;} html:lang(ko) .hallyuBanner > ul > li> dl > dt{font-weight:700; } html:lang(ko) .hallyuBanner > ul > li> dl > dd{ font-weight: 100;} html:lang(ko) .hallyuBanner > ul > li > a{ font-weight:200;} html:lang(ko) .nav li:nth-child(2) > div > ul{width:100%; text-align:center;max-width: 1200px;} html:lang(ko) .nav li:nth-child(4) > div > ul{width:100%; text-align:center;max-width: 1200px;} /* kdy - start */ /* 영어 */ html:lang(en) .galleryNews .tab_content .galleryTxt .btnGallery::after {content: ''; display:inline-block; position:absolute; width:8px; height:8px; border-top:2px solid #fff; border-right:2px solid #fff; top:6px; left:35px; transform: rotate(45deg); /* 반대각도 315deg 135deg 225deg */} html:lang(en) .newsletter .right {padding-left: 4%;} /* 러시아어 */ html:lang(ru) .galleryNews .tab_content .galleryTxt .btnGallery::after {content: ''; display:inline-block; position:absolute; width:8px; height:8px; border-top:2px solid #fff; border-right:2px solid #fff; top:6px; left:95px; transform: rotate(45deg); /* 반대각도 315deg 135deg 225deg */} html:lang(ru) .newsletter h3 {font-size: 23px; width: 326px;} html:lang(ru) .newsletter .right {padding-left: 6%;} html:lang(ru) .newsletter .input-box {padding: 12px 0px 30px;} /* 카자흐스탄어 */ html:lang(kk) .galleryNews .tab_content .galleryTxt .btnGallery::after {content: ''; display:inline-block; position:absolute; width:8px; height:8px; border-top:2px solid #fff; border-right:2px solid #fff; top:6px; left:95px; transform: rotate(45deg); /* 반대각도 315deg 135deg 225deg */} html:lang(kk) .newsletter h3 {font-size: 23px; width: 326px;} html:lang(kk) .newsletter .right {padding-left: 6%;} html:lang(kk) .newsletter .input-box {padding: 12px 0px 30px;} /* 아랍어 */ html:lang(ar) .galleryNews > div.tabs {text-align: right;} html:lang(ar) .galleryNews .tab_content .galleryTxt .btnGallery {position: absolute; left: 45px; bottom: 30px; display: inline-block; color: #fff; font-size: 14px; padding-right: 10px;} html:lang(ar) .galleryNews .tab_content .galleryTxt .btnGallery::after {content: ''; display:inline-block; position:absolute; width:8px; height:8px; border-top:2px solid #fff; border-right:2px solid #fff; top:6px; left:-15px; transform: rotate(225deg); /* 반대각도 315deg 135deg 225deg */} /* 이탈리아어 */ html:lang(it) .galleryNews .tab_content .galleryTxt .btnGallery::after {content: ''; display:inline-block; position:absolute; width:8px; height:8px; border-top:2px solid #fff; border-right:2px solid #fff; top:6px; left:125px; transform: rotate(45deg); /* 반대각도 315deg 135deg 225deg */} /* 터키어 */ html:lang(tr) .galleryNews .tab_content .galleryTxt .btnGallery::after {content: ''; display:inline-block; position:absolute; width:8px; height:8px; border-top:2px solid #fff; border-right:2px solid #fff; top:6px; left:90px; transform: rotate(45deg); /* 반대각도 315deg 135deg 225deg */} /* 헝가리어어 */ html:lang(hu) .newsletter .right {padding-left: 4%;} /* kdy - end */ label.check {display: inline-block;text-align: left;} label.check input[type="checkbox"] { width: 24px;height: 24px;min-height: 24px;padding: 0;vertical-align: middle;-webkit-transition: all .5s;transition: all .5s;border: 1px solid #ddd;border-radius: 2px; } label.check input[type="checkbox"]:checked { border: 1px solid #ddd; -webkit-transition: all .5s;transition: all .5s; } label.check span {display: inline-block;padding-left: 5px;color: #404040;font-size: 15px;text-align: left;font-weight: 200;line-height: 24px;} .newsletter .btn-detail {margin: 0 0 0 30px;font-size: 15px; color: #c0205f;text-decoration: underline;font-weight: 200;vertical-align: top;background: transparent;} /*------------------------------------------------------------------- ## footer -------------------------------------------------------------------*/ .select-box {} .select-box ul {font-size: 0;max-width: 1400px;margin: auto;overflow: hidden;border: 1px solid #5c5c5c;} .select-box ul li {position: relative; float: left;width: 25%;font-size: 0;padding: 10px 0;} .select-box ul li label {display: inline-block;width: 0;height: 0;font-size: 0;color: transparent;line-height: 0;} .select-box ul li select { cursor: pointer;width: 100%;height: 40px;line-height: 40px; padding: 0 15px;box-sizing: border-box;background: url(../../image/front/new/select-arrowC.png) calc(100% - 15px) center no-repeat; font-size: 16px;color: #000;-webkit-appearance: none;-moz-appearance: none;appearance: none;transition: 0.3s;font-weight: 100; } .select-box ul li select option {font-weight: 100;line-height: 60px;} .select-box ul li + li:before {content: '';display: inline-block; position: absolute;left: 0;top: 0;bottom: 0; border-left: 1px solid #78808b;} .address-box {position: relative; padding: 36px 0;} .address-box ul {position: relative;font-size: 0;max-width: 1400px;margin: auto;overflow: hidden;} .address-box ul p {font-size: 16px;color: #505050;font-weight: 100;line-height: 1.4;width: 980px;} .address-box ul p + p {padding-top: 2px;} /* kdy - start */ /* .address-box .etc {position: absolute;right: 0;top: 50%;transform: translateY(-50%);} */ .address-box .etc {position: absolute;right: 0;top: 60%;transform: translateY(-50%);} /* kdy - end */ .address-box .etc a {font-size: 16px;color: #3d3c3c;font-weight: 500;line-height: 1.4;} .address-box .etc a + a {margin-left: 40px;color: #969696;} .mobile-nav {display: none;} .lines-button {display: none;} .menu_close {display: none;} .search-mobile {display: none;} @media screen and (min-width: 1071px) { /* 한국어 */ html:lang(ko) .nav ul{display:inline-block;min-width: 700px;} html:lang(ko) .nav li:nth-child(1) > div > ul{width:100%; text-align:left;max-width: 1000px;} html:lang(ko) .nav li:nth-child(3) > div > ul{width:100%; text-align:center;max-width: 1300px;} html:lang(ko) .hallyu_bbs ul li a dl dd {line-height: 1.4em;} /* 태국어 */ html:lang(th) .nav li.depth01 {max-width: 20%;} html:lang(th) .nav li.depth01 a.depth01Txt {line-height: 1.2;} html:lang(th) .multiLink {position: absolute;right: 0;top: 0;} html:lang(th) .headerWrap {position: relative;} html:lang(th) .nav li:nth-child(2) > div > ul {width:100%; text-align:center;max-width: 920px;} html:lang(th) .nav li:nth-child(3) > div > ul {width:100%; text-align:center;max-width: 920px;} html:lang(th) .nav li.depth01.on:nth-child(2) > div > ul > li {padding: 0 10px;} html:lang(th) .newsletter .right {padding-left: 7%;} /* 영어 */ html:lang(en) .nav{display:inline-block; width:calc(100% - 466px); height:100%; margin:0 auto; text-align:-webkit-right;} html:lang(en) .nav ul{display:inline-block;min-width: 745px;} /* html:lang(en) .nav li.depth01 a.depth01Txt {padding: 0 13px;} 20230109 gnb 간격 수정_UAE */ html:lang(en) .nav li.depth01.on .navSub{text-align: center;} html:lang(en) .nav li:nth-child(1) > div > ul{width:100%; text-align:left;max-width: 1200px;} html:lang(en) .nav li:nth-child(2) > div > ul{width:100%; text-align:center;max-width: 1550px;} html:lang(en) .nav li:nth-child(4) > div > ul{width:100%; text-align:center;max-width: 1200px;} html:lang(en) .nav li:nth-child(5) > div > ul{width:100%; text-align:center;max-width: 1200px;} html:lang(en) .galleryNews .tab_content .galleryTxt .gallerySubtxt{line-height:1.6;} html:lang(en) .hallyu_bbs ul li a dl dd {line-height: 1.4;} html:lang(en) .galleryNews .tabs button.active {height: 30px;} html:lang(en) .galleryNews .tabs button {height: 30px;} /* 러시아어 */ html:lang(ru) .nav ul{display:inline-block; /* min-width: 710px; */} /* 20230217 min-width 삭제 */ html:lang(ru) .nav li:nth-child(1) > div > ul{width:100%; text-align:center;max-width: 1400px;} html:lang(ru) .nav li:nth-child(2) > div > ul{width:100%; text-align:center;max-width: 1200px;} html:lang(ru) .nav li:nth-child(4) > div > ul{width:100%; text-align:center;max-width: 1200px;} /* 카자흐어 */ html:lang(kk) .nav li:nth-child(1) > div > ul{width:100%; text-align:center;max-width: 1000px;} html:lang(kk) .nav li:nth-child(2) > div > ul{width:100%; text-align:center;max-width: 1400px;} html:lang(kk) .nav li:nth-child(4) > div > ul{width:100%; text-align:center;max-width: 1200px;} /* 스페인어 */ html:lang(es) .flex-box > .cultural-info {padding: 24px 0 48px 0;} html:lang(es) .nav ul{display:inline-block;min-width: 740px;} html:lang(es) .nav li:nth-child(1) > div > ul{width: 900px;; text-align:left;} html:lang(es) .nav li:nth-child(2) > div > ul{width:100%; text-align:center;max-width: 1200px;} html:lang(es) .nav li:nth-child(3) > div > ul{width: 1030px;; text-align:center;} html:lang(es) .nav li:nth-child(4) > div > ul{width:100%; text-align:center;max-width: 900px;} html:lang(es) .nav{display:inline-block; width:calc(100% - 430px); height:100%; margin:0 auto; text-align:center;} html:lang(es) .newsletter .right {padding-left: 5%;} /* 베트남어 */ html:lang(vi) .nav li.depth01 a.depth01Txt{ position:relative; display:table-cell; text-align:center; font-size:18px; color:#444; padding:0 25px; vertical-align:middle; font-weight:300; } html:lang(vi) .nav li:nth-child(1) > div > ul{width:100%; text-align:left;max-width: 1200px;} html:lang(vi) .nav li:nth-child(2) > div > ul{width:100%; text-align:left;max-width: 1000px;} html:lang(vi) .nav li:nth-child(5) > div > ul {left: 230px;} html:lang(vi) .nav{display:inline-block; width:calc(100% - 410px); height:100%; margin:0 -20px; text-align:center;} html:lang(vi) .newsletter .right {padding-left: 3%;} /* 프랑스어 */ html:lang(fr) .nav li.depth01 a.depth01Txt{ position:relative; display:table-cell; text-align:center; font-size:18px; color:#444; padding:0 25px; vertical-align:middle; font-weight:300; } html:lang(fr) .nav li:nth-child(2) > div > ul{width:100%; text-align:center;max-width: 1400px;} html:lang(fr) .nav li:nth-child(4) > div > ul{width:100%; text-align:center;max-width: 1400px;} html:lang(fr) .nav li:nth-child(5) > div > ul{width:100%; text-align:right;max-width: 1200px;} html:lang(fr) .hallyu_bbs ul li a dl dt {height: 20px;} html:lang(fr) .newsletter .right {padding-left: 3%;} /* 네덜란드어 */ html:lang(nl) .cultural-info .cultural dl + dl {padding-top: 25px;} html:lang(nl) .nav li:nth-child(1) > div > ul{width:900px; text-align:left;} html:lang(nl) .nav li:nth-child(2) > div > ul{width:100%; text-align:center;max-width: 1400px;} html:lang(nl) .nav li:nth-child(4) > div > ul{width:100%; text-align:center;max-width: 1400px;} html:lang(nl) .nav li:nth-child(5) > div > ul{width:100%; text-align:right;max-width: 1200px;} html:lang(nl) .nav{display:inline-block; width:calc(100% - 410px); height:100%; margin:0 -20px; text-align:center;} html:lang(nl) .newsletter .right {padding-left: 3%;} /* 포르투칼어 */ html:lang(pt) .nav li:nth-child(1) > div > ul{width:100%; text-align:left;max-width: 1200px;} html:lang(pt) .nav li:nth-child(2) > div > ul{width:100%; text-align:center;max-width: 1200px;} html:lang(pt) .nav li:nth-child(4) > div > ul{width:100%; text-align:center;max-width: 1200px;} html:lang(pt) .nav{display:inline-block; width:calc(100% - 410px); height:100%; margin:0 -20px; text-align:center;} html:lang(pt) .newsletter .right {padding-left: 7%;} /* 이탈리아어 */ html:lang(it) .nav li:nth-child(1) > div > ul{width:100%; text-align:left;max-width: 1200px;} html:lang(it) .nav li:nth-child(2) > div > ul{width:100%; text-align:center;max-width: 1200px;} html:lang(it) .nav li:nth-child(3) > div > ul{width:100%; text-align:right;max-width: 1200px;} html:lang(it) .newsletter .right {padding-left: 3%;} /* 인도네시아어 */ html:lang(id) .nav li:nth-child(2) > div > ul{width:100%; text-align:center;max-width: 1400px;} html:lang(id) .nav li:nth-child(4) > div > ul{width:100%; text-align:center;max-width: 1200px;} html:lang(id) .nav{display:inline-block; width:calc(100% - 460px); height:100%; margin:0 -20px; text-align:center;} html:lang(id) .hallyu_bbs ul li a dl dd {line-height: 1.4em;} html:lang(id) .newsletter .right {padding-left: 3%;} /* 헝가리어 */ html:lang(hu) .nav li:nth-child(1) > div > ul{width:100%; text-align:center;max-width: 900px;} html:lang(hu) .nav li:nth-child(2) > div > ul{width:100%; text-align:center;max-width: 1400px;} html:lang(hu) .nav li:nth-child(4) > div > ul{width:100%; text-align:center;max-width: 1000px;} /* 중국어(광동어) */ html:lang(hk) .nav li:nth-child(2) > div > ul{width:780px; text-align:left;} html:lang(hk) .nav li:nth-child(5) > div > ul{width:100%; text-align:center;max-width: 1000px;} html:lang(hk) .nav{display:inline-block; width:calc(100% - 450px); height:100%; margin:0 auto; text-align:center;} /* 터키어 */ html:lang(tr) .nav li:nth-child(1) > div > ul{width:100%; text-align:center;max-width: 1200px;} html:lang(tr) .nav li:nth-child(2) > div > ul{width:100%; text-align:center;max-width: 1400px;} html:lang(tr) .nav li:nth-child(3) > div > ul{width:100%; text-align:center;max-width: 1000px;} html:lang(tr) .newsletter .right {padding-left: 5%;} /* 폴란드어 */ html:lang(pl) .nav li:nth-child(2) > div > ul{width:100%; text-align:center;max-width: 1200px;} html:lang(pl) .nav li:nth-child(4) > div > ul{width:100%; text-align:center;max-width: 1200px;} html:lang(pl) .nav li:nth-child(5) > div > ul{width:100%; text-align:center;max-width: 1200px;} html:lang(pl) .newsletter .right {padding-left: 1%;} /* 아랍어 */ html:lang(ar) .galleryNews .tab_content .galleryTxt .gallerySubtxt {width: 90%;} html:lang(ar) .nav li:nth-child(2) > div > ul{width:100%; text-align:center;max-width: 1200px;} html:lang(ar) .nav li:nth-child(3) > div > ul{width:100%; text-align: center !important;max-width: 1200px;} html:lang(ar) .nav li:nth-child(4) > div > ul{width:100%; text-align:center;max-width: 1200px;} } /* 아랍어 */ html:lang(ar) body {font-family: 'Arabic Transparent', arial, sans-serif;direction: rtl;} html:lang(ar) .logoArea {float: right;} html:lang(ar) .multiLink {float: left;} html:lang(ar) .multiLink .langForm {float: right;} html:lang(ar) .multiLink > div:first-child {margin-left: 20px;} html:lang(ar) .multiLink > div {float: right;margin-left: 20px;} html:lang(ar) .logoSub li.logotxt01:after {margin-left: 0; margin-right: 10px;} html:lang(ar) .logoSub li.logotxt02 {padding-left: 0;padding-right: 8px;} html:lang(ar) .visual > span {float: left;} html:lang(ar) .visual .visualText {padding: 0 0 0 20px;} html:lang(ar) .galleryNews .tab_content > p {right: auto;left: 0;} html:lang(ar) .tabs button {margin: 0 0 0 60px;} html:lang(ar) .galleryTit {text-align: right;} html:lang(ar) .galleryNews .tab_content > ul > li + li, html:lang(ar) .galleryNews .tab_content > ul > li:last-child {margin-right: 10px;margin-left: 0;} html:lang(ar) .notice .tab_content > p {right: auto;left: 0;} html:lang(ar) .notice > div.tabs {text-align: right;} html:lang(ar) .notice .tab_content > ul > li + li {margin: 0 30px 0 0;} html:lang(ar) .notice .tab_content > ul > li a {width: 100%;display: inline-block;text-align: right;} html:lang(ar) .flex-box > .cultural-info {margin: 0 70px 0 0;} html:lang(ar) .tab_content .title {text-align: right;} html:lang(ar) .cultural-info .cultural {text-align: right;padding: 30px 25px 30px 0;} html:lang(ar) .hallyu_bbs ul li + li {margin: 0 100px 0 0;} html:lang(ar) .hallyu_bbs ul li a span {float: right;} html:lang(ar) .hallyu_bbs ul li a dl dt, html:lang(ar) .hallyu_bbs ul li a dl dd {text-align: right;} html:lang(ar) .notice-Board .notice-slider {float: left;margin: 0 2% 0 0;} html:lang(ar) .notice-Board .koreanet {float: right;} html:lang(ar) .bx-wrapper {direction: ltr;} html:lang(ar) .notice-slider .bx-controls {right: auto;left: 15px;} html:lang(ar) .notice-slider .bx-controls-direction {right: auto;left: -4px;} html:lang(ar) #notice-counter {left: 62px;right: auto;} html:lang(ar) .notice-slider .bx-controls-auto {right: auto;left: 35px;} html:lang(ar) .notice-slider .bx-controls-auto .bx-controls-auto-item {direction: rtl;} html:lang(ar) .banner_slider .bx-wrapper .bx-viewport {max-height: 42px;} html:lang(ar) .banner_slider li a span {background-position: 0 center;padding-left: 20px;padding-right: 0;line-height: 1.2;} html:lang(ar) .banner_slider .bx-wrapper .bx-controls {right: auto;left: 0;} html:lang(ar) .banner_slider .bx-wrapper .bx-controls .bx-controls-direction {left: 30px;} html:lang(ar) .banner_slider .bx-controls-auto {right: auto;left: 77px;} html:lang(ar) .newsletter h3 {position: relative;float: right;font-size: 25px;color: #111111;font-weight: 700;line-height: 1;} html:lang(ar) .newsletter .right {overflow: hidden;text-align: left;padding-right: 15%;padding-left: 0;} html:lang(ar) .newsletter h3::after {right: 0;left: auto;} html:lang(ar) .newsletter .input-box input + input {margin: 0 80px 0 0;} html:lang(ar) .newsletter .btn-news {margin: 0 50px 0 0;} html:lang(ar) .newsletter .newsletter-agree {text-align: right;} html:lang(ar) label.check span {padding: 0 5px 0 0;} html:lang(ar) .select-box ul li select {background-position: left 15px center;} html:lang(ar) .address-box .etc {left: 0;right: auto;} html:lang(ar) .cultural-info h3 {text-align: right;} /* html:lang(ar) */ /* html:lang(ar) */ /* html:lang(ar) */ /* html:lang(ar) */ /* 베트남어 */ html:lang(vi) .cultural-info .cultural {height: calc(100% - 60px);} html:lang(vi) .galleryNews .tab_content .galleryTxt .btnGallery{right: 40px;} /* 태국어 */ html:lang(th) .galleryNews .tab_content .galleryTxt .btnGallery::after {left: 60px;} /* 중국(광동)어 */ html:lang(hk) .galleryNews .tab_content .galleryTxt .btnGallery::after {left: 30px;} /* 인도네시아어 */ html:lang(id) .cultural-info h3 {font-size: 19px; padding: 0px 0px 27px 0px;} @media screen and (min-width: 1071px) { html:lang(ar) .nav li > div > ul {text-align: right !important;} html:lang(ar) .nav li:nth-child(2) > div > ul {width:100%; text-align:center;max-width: 1000px;} html:lang(ar) .nav li:nth-child(4) > div > ul {width:100%; text-align:center !important;max-width: 865px;} html:lang(ar) .nav li:nth-child(5) > div > ul {text-align: left !important;min-width: 400px;width: 400px;} html:lang(ar) .main_slider .bx-controls {right: 0;left: auto;} html:lang(ar) .main_slider .bx-controls-direction {right: 0;left: auto;} html:lang(ar) .main_slider .bx-controls-auto {right: 27px;left: auto;padding: 15px 0 15px 48px;} html:lang(ar) #slide-counter {right: 30px;left: auto;} html:lang(ar) .searchBox-area button.btn-submit {left: 0;right: auto;} html:lang(ar) .nav li.depth01 {float: right;} html:lang(ar) .nav li.depth01.on .navSub {direction: ltr;} } /* 뉴스레터 구독하기 20230413 start */ .subs_wrapper{position: relative; background-color: #eceeec; height: 100px; width: 1400px; margin: 0 auto 40px;} .subs_inner{position: relative; display: flex; flex-direction: row; align-items: center; margin: 0 auto; width: 1400px; background: url(../../image/front/main/img_subsMain02.png) no-repeat; height: inherit; box-sizing: border-box; padding-left: 40px;} .subs_inner::after{content: ''; position: absolute; bottom: 0; right: 40px; width: 300px; height: 120px; background: url(../../image/front/main/img_subsMain01.png) no-repeat;} .subs_inner h2{font-size: 26px; font-weight: bold; margin-right: 20px;} .subs_inner button{position: relative; font-size: 16px; color: #1361a6; font-weight: bold; background-color: #fff; border-radius: 500px; border: 1px solid #d4d4d4; padding: 9px 90px 9px 15px; transition: 0.2s;} .subs_inner button::after{content: ''; position: absolute; right: 4px; top: 50%; transform: translateY(-50%); height: 34px; width: 34px; border-radius: 500px; background:#1361a6 url(../../image/front/main/bullet_sbus.png) no-repeat center;} .subs_inner button:hover{background-color: #1361a6; color: #fff; border: 1px solid #1361a6;} html:lang(ar) .subs_inner::after {right: auto; left: 40px; } html:lang(ar) .subs_inner {padding-left: 0px; padding-right: 40px;} html:lang(ar) .subs_inner h2 {margin-right: 0px; margin-left: 20px;} @media screen and (max-width: 1400px){ .subs_inner{width: 100%;} .subs_wrapper{width: 100%;} } @media screen and (max-width: 1000px){ .subs_wrapper{height: auto; padding: 20px 0;} .subs_inner{flex-direction: column; align-items: flex-start; justify-content: center; padding-left: 30px;} .subs_inner::after{bottom: -20px; right: 30px; } .subs_inner h2{margin-bottom: 10px; font-size: 22px;} .subs_inner button{position: relative; font-size: 15px;} } @media screen and (max-width: 768px){ .subs_inner{padding-left: 20px;} .subs_inner::after{bottom: -20px; right: 20px; width: 270px; height: 109px; background-size: 270px;} .subs_inner h2{margin-bottom: 10px;} } @media screen and (max-width: 640px){ .subs_wrapper{padding-bottom: 130px;} .subs_inner{align-items: center; padding-left: 0px;} .subs_inner::after{bottom: -130px; right: 0px; width: 100%; background-position: bottom center;} .subs_inner h2 {margin-right: 0; font-size: 20px;} html:lang(ar) .subs_inner {padding-right: 0px;} html:lang(ar) .subs_inner h2 {margin-left: 0px;} html:lang(ar) .subs_inner::after {left: 0px; } } /* 뉴스레터 구독하기 20230413 end */ /* tablet Size */ /* tablet Size */ @media only screen and (min-width: 768px) and (max-width: 1070px) { #header {height: 70px;} .logoArea h1 a {width: 170px;height: 70px;padding: 5px 0 0 0;background: url(../../image/front/main/logo_btype.png) center center no-repeat;background-size: 140px;} .logoArea h1 a.logoCanada{width: 170px;height: 70px;padding: 5px 0 0 0;background: url(../../image/front/main/logo_btype_ca.png) center center no-repeat;background-size: 140px;} /* 20240724 캐나다 로고 추가 */ .mobile-nav {display: none;} .lines-button {display: block;background: url(../../image/front/main/icon_allMenu_active.png) center center no-repeat;background-size:25px;} .lines-button {position: absolute;right: 0;top: 0;height: 100%;width: 45px;z-index: 999;} .menu_close {display: none;background: url(../../image/front/main/btn_close2_over.png) center 15px no-repeat;background-size: 22px;} .menu_close {position: absolute;right: 10px;top: 0;height: 100%;width: 45px;padding-top: 35px;z-index: 999;font-size: 14px;color: #fff;font-weight: 100;} .menu_close .menu-line {display: block;position: absolute;height: 2px;width: 25px;} .menu_close .menu-line:first-of-type {top: 9px;transform:rotate(315deg);} .menu_close .menu-line:nth-of-type(2) {display: none;} .menu_close .menu-line:nth-of-type(3) {top: 9px;transform:rotate(-315deg);} .menu-line:after, .menu-line:before {position: absolute;top: 0;left: 0;width: 100%;height: 100%;content: "";border-radius: 2px;box-sizing: border-box;background-color: #000;} .search-mobile {display: inline-block;} .search-mobile .btnSearch { display: inline-block;position: absolute;right: 45px;top: 0;height: 100%;width: 45px;border-radius: 0; background: url(../../image/front/main/icon_search_active.png) center center no-repeat;background-size:25px; } .btnSearch, .searchForm.open .btnSearch { height: 70px;width: 55px;padding: 46px 0 0 0;position: absolute;right: 65px;border-radius:0; background: url(../../image/front/main/icon_search2.png) center 15px no-repeat; } .search-mobile.open .btnSearch {background: #c02462 url(../../image/front/main/icon_search_on.png) center center no-repeat;border-radius: 0;} .search-mobile.open .mobilesearchBoxHeader .searchBox-bg {background-color: #c02462;height: 62px;opacity: 1;} .searchBox-area input::placeholder{color:#cfa6b6 !important;} .search-mobile .mobilesearchBoxHeader {top: 70px;z-index: 99;} .searchBox-area input {border-bottom: 2px solid #fff;color: #fff;} .mb-group .searchBox-area input {border-bottom: 2px solid #333;color: #333;} .mb-group .searchBox-area button.btn-submit {background: url(../../image/front/main/icon_searchC.png) center center no-repeat;} .searchBox-area button.btn-submit { background: url(../../image/front/main/icon_search2.png) center center no-repeat;} .mb-group .btnSearch .IR, .mb-group .btnhome .IR {width: 100%;height: 20px;font-size: 14px;color: #fff;font-weight: 100;line-height: 1; text-align: center;} .mb-group .btnhome {display: inline-block; height: 70px;width: 45px;padding-top: 42px;position: absolute;right: 135px;background: url(../../image/front/main/icon_home_over.png) center 15px no-repeat;} .mb-group .multiLink > div:first-child {padding: 14px 0 0 20px;border-bottom:0} .mb-group .langForm .btnLang { border: 1px solid #fff;min-width: 103px;border-radius: 4px;text-align: left;height: 100%;padding: 0 30px 0 10px;font-size: 15px; line-height: 28px;color: #fff;font-weight: 500;background:transparent url(../../image/front/main/icon_langSelect.png) calc(100% - 10px) center no-repeat; } .mb-group .langForm .btnLang::after {content: none;} .mb-group .snsForm .btnSns {display: none;} .mb-group .snsForm > ul {background: transparent;display: block;border: 0;position: fixed;bottom: 20px;top: auto;left: auto;right: 240px;} .mb-group .snsForm {position: absolute;left: 10px;bottom: 20px;} .mb-group .snsForm > ul > li {display: inline-block;padding: 0;} .mb-group .snsForm > ul > li + li {margin-left: 5px;} .mb-group .snsForm > ul > li > a {padding: 10px;line-height: 1;} .mb-group .snsForm > ul > li > a span {font-size: 0;text-indent: -9999px;} .mb-group .langForm > ul {top: 43px;right: 0;width: 103px;border-radius: 4px;} .mb-group .langForm > ul > li {padding: 0;} .mb-group .langForm > ul > li > a {padding: 8px 10px;} .mb-group .langForm > ul > li > a:hover {color: #fff;background-color: #1e90ff;} .main_slider {margin: auto 20px;} .visual > div a {bottom: -30px;top: auto;} .visual .visualText {padding: 25px 20px 25px 0;} .main_slider .bx-wrapper {width: 100%;} .visual > span {width: 65%;} .visual > span img {max-height: 320px;} .visual .title {font-size: 28px;line-height: 48px;max-height: 95px;} /* .main_slider .bx-controls-direction {bottom: 0;top: auto;transform: none;} */ .multiLink {position: absolute;right: 0;top: -70px;margin: 0;height: 70px; background-color: #c02462;padding: 0;width: 100%;box-sizing: border-box;} .searchForm .searchBoxHeader {top: 70px;} .main_slider .bx-controls {top: auto;left: 100px;transform: inherit;bottom: 20px;} #slide-counter {top: auto;right: 145px;transform: inherit;bottom: 5px;} .searchForm.open .searchBoxHeader .searchBox-bg {height: 60px;} .mb-group {position: fixed;top: 70px;bottom: 0;right: -40rem;z-index: 997;max-width: 420px;height: 100%;width: 85%;background-color: #fff;display: none;} .nav {display: block;width: 100%;background-color: #f1f1f1;z-index: 998;} .nav > ul {display: block !important; min-width: 10px; overflow: hidden;} /* 20230214 !important 추가 */ .nav > ul::before {content: '';display: inline-block;background: #fff;position: absolute; top: 0;bottom: 0;left: 0;width: 50%;} .nav li.depth01 {display: block;float: none;height: auto;} .nav li.depth01.active a.depth01Txt {background:url("../../image/front/main/mobNav_bullet01on.png") calc(100% - 10px) center no-repeat;color:#c02462;} /* 20230217 calc 수정 */ .nav li.depth01 a.depth01Txt:hover, .nav li.depth01 a.depth01Txt:focus{ background:url("../../image/front/main/mobNav_bullet01on.png") calc(100% - 10px) center no-repeat;color:#c02462; } /* 20230217 calc 수정 */ .nav li.depth01 a.depth01Txt { padding : 15px 10px;width: 50%;text-align: left;box-sizing: border-box;color: #2c2c2c;display: block; background:#fff;font-size: 18px;font-weight: 500; height: auto; } /* 20230217 padding 수정, height 추가 */ .nav li.depth01 .navSub {left: 160px;top: 0;border-top: 0;box-shadow: none;} .nav li.depth01.active .navSub {left: 50%;top: 0; border-top: 0; box-shadow: none; display: block !important; width: 50%;} /* 20230217 width 추가 */ .nav li.depth01.active .navSub ul li {display: block;line-height: 1;border-bottom: 1px solid #e6e6e6;margin:0} .nav li.depth01.active .navSub li a {display: block;padding: 13px 20px;text-align: left;border-bottom: 1px solid #eee;font-size: 16px;} .nav li:nth-child(2) > div > ul {width: 100%;} .nav li.depth01 .navSub ul {display: block !important; width: 100%;} /* 20230214 display 추가 */ .nav ul {min-width: 100px;} .nav li.depth01 a.depth01Txt:before {content: none;} .nav li.depth01 a.depth01Txt:after {content: none;} .dimm100 {position: fixed;top: 0;left: 0;z-index: 97;width: 100%;height: 100%;background-color: #000;opacity: 0.8;filter: alpha(opacity=80);} .galleryNews {width: calc(100% - 270px); padding: 30px 10px 20px 0px;} .galleryNews .tab_content > ul { width: 100%;height: 100%;display: -webkit-box;display: -ms-flexbox;-webkit-box-orient: horizontal;-ms-flex-direction: row;display: -moz-box;-moz-box-orient: horizontal;display: box;box-orient: horizontal; } .galleryNews .tab_content > ul > li {display: block;-webkit-box-flex: 1;-ms-flex: 1;-moz-box-flex: 1;box-flex: 1;text-align: center;padding: 8px 0px 0 0;} .galleryNews .tab_content > ul > li + li {margin-left: 20px;} .galleryNews .tab_content > ul > li a.galleryImg {width: 100%;height: auto;} .galleryNews .tab_content > ul > li a.galleryImg img {object-fit: cover;height: 200px;} .tab > ul > li > a {padding: 15px 5px 0 5px;font-size: 22px;} .tab > ul > li > a.show:after {bottom: 5px;height: 5px;} .galleryNews .tab_content > ul > li::after {width: 50px;height: 50px;border-top: solid 8px #1361a6;border-right: solid 8px #1361a6;} .galleryNews .tab_content > ul > li a.galleryBtn {padding: 10px 86px 10px 15px;} .galleryNews .tab_content > ul > li a.galleryBtn::after {top: 16px;} .galleryNews .tabs button.active {font-size: 21px;} /* 20230220 추가 */ .galleryNews .tabs button {font-size: 18px;} /* 20230220 추가 */ .infoWrap {margin: 20px auto;} .infoArea {background-size: cover;} .noticeWrap {padding: 0 20px;} .noticeArea h1 {font-size: 21px;} .noticeArea > p a {width: 40px;height: 40px;} .noticeArea ul li a {max-height: 160px;padding: 20px 15px;} .noticeArea ul li a p.txt {font-size: 16px;line-height: 1.6em;white-space: normal;height: 70px; text-align: left; word-wrap: break-word; display: -webkit-box;display: -ms-flexbox; -webkit-line-clamp: 3; -webkit-box-orient: vertical;overflow: hidden;} .notice .tab_content > ul > li + li {margin-left: 10px;} .notice .tabs button.active {font-size: 21px;} /* 20230220 추가 */ .notice .tab_content > ul > li {padding: 30px 10px;border: 1px solid #c5c5c5;} .tab_content .title {font-size: 14px;line-height: 1.4;max-height: 40px;min-height: 40px;} .tab_content .date {padding: 22px 0 20px;font-size: 13px;} .tab_content .detail {padding: 4px 18px;font-size: 14px;} .cultural-info h3 {padding-bottom: 29px; font-size: 20px;} /* 20230220 font-size 추가 */ .cultural-info .cultural {padding: 18px 10px 30px 15px;} .cultural-info .cultural dl dt {padding-bottom: 15px;font-size: 15px;} .cultural-info .cultural dl dd {font-size: 14px;} .cultural-info .cultural dl + dl {padding-top: 20px;} .notice {padding: 20px 0 40px 0;} .hallyuBanner {margin-top: 30px;} .hallyu_bbs ul li + li {margin-left: 20px;} .hallyuwrap {padding-bottom: 40px;} .hallyu_bbs {padding: 0 20px;box-sizing: border-box;} .flex-box {padding: 0 20px 0;box-sizing: border-box;} .flex-box > .cultural-info {margin-left: 10px; max-width: 250px;padding: 30px 0 20px 0;} .hallyu_banner ul li h4 {font-size: 20px;} .hallyuBbs ul { width: 100%;height: 100%;display: -webkit-box;display: -ms-flexbox;-webkit-box-orient: horizontal;-ms-flex-direction: row;display: -moz-box;-moz-box-orient: horizontal;display: box;box-orient: horizontal; } .hallyuBbs ul li {display: block;-webkit-box-flex: 1;-ms-flex: 1;-moz-box-flex: 1;box-flex: 1;text-align: center;margin-right:0} .hallyuBbs ul li + li {margin-left: 5%;} .hallyuBbs ul li a span {display: inline-block;float: left;width: 50%;} .hallyuBbs ul li a dl {display: inline-block;width: 50%;} .hallyuBbs ul li a img {width: 100%;object-fit: cover;} .hallyuBanner > ul > li {position: relative;} .hallyuBanner > ul > li > dl {height: 110px;} .hallyuBanner > ul > li> dl > dd {width: 70%;font-size: 16px;} .hallyuBanner > ul > li > dl.hallyuBanner01 {background: url(../../image/front/main/hallyu_banner01.png) right 20px no-repeat;background-size: 70px;} .hallyuBanner > ul > li > dl.hallyuBanner02 {background: url(../../image/front/main/hallyu_banner02.png) right 20px no-repeat;background-size: 70px;} .hallyuBanner > ul > li > dl.hallyuBanner03 {background: url(../../image/front/main/hallyu_banner03.png) right 20px no-repeat;background-size: 70px;} .hallyuBanner > ul > li > a {position: absolute;bottom: 0;margin: 0;} .hallyuBanner > ul > li > a::after {width: 25px;height: 25px;background-size: 8px;} /* 코리아넷 */ .Korea-net-k{width:100%;} .Korea-net-k .Koreanet-box ul li:first-of-type {padding-left: 20px;} .Korea-net-k .Koreanet-box ul li{padding-left: 20px;} .Korea-net-k h4 span{font-size:18px !important;} /* .notice-Board .notice-slider {margin-left: 1%;width: 31%;} */ .notice-Board {margin: 0 auto 40px;} .newsletter .input-box { width: 100%;height: 100%;display: -webkit-box;display: -ms-flexbox;-webkit-box-orient: horizontal;-ms-flex-direction: row;display: -moz-box;-moz-box-orient: horizontal;display: box;box-orient: horizontal; } .newsletter .input-box input + input {margin-left: 40px;} .newsletter .input-box input {display: block;-webkit-box-flex: 1;-ms-flex: 1;-moz-box-flex: 1;box-flex: 1;text-align: left;} .newsletter .input-box button {display: block;-webkit-box-flex: 0;-ms-flex: 0;-moz-box-flex: 0;box-flex: 0;text-align: center;} .select-box ul li select {height: 35px;line-height: 35px;font-size: 14px;} .newsletter {padding: 0 20px 40px;} .newsletter h3 {font-size: 21px;float: none;} .newsletter .right {text-align: left;padding-left: 0;padding-top: 30px;} .address-box {padding: 30px 20px 30px;} .address-box li:first-of-type {max-width: 72%;} .address-box ul p {font-size: 13px; width: 440px;} .address-box .etc a {font-size: 13px;} /* 언어별 */ /* 러시아어 */ html:lang(ru) .nav li.depth01.active .navSub li a {display: block;padding: 11px;text-align: left;border-bottom: 1px solid #eee;font-size: 16px;letter-spacing: -1px;} html:lang(ru) .flex-box > .cultural-info {padding: 26px 0 28px 0;} html:lang(ru) .cultural-info h3 {font-size: 21px;} /* 스페인어 */ html:lang(es) .galleryNews .tab_content .galleryTxt .btnGallery {right: 25px;} html:lang(es) .flex-box > .cultural-info {padding: 25px 0 28px 0;} /* 터키어 */ html:lang(tr) .cultural-info h3 {font-size: 20px; padding: 0px 0px 27px 0px;} /* 카자흐어 */ html:lang(kk) .cultural-info h3 {font-size: 20px; padding: 0px 0px 27px 0px;} /* 인도네시아어 */ html:lang(id) .cultural-info h3{font-size: 19px; padding: 0px 0px 0px 0px;} /* 베트남어 */ html:lang(vi) .cultural-info h3{font-size: 19px; padding: 0px 0px 26px 0px;} /* 아랍어 */ html:lang(ar) .main_slider .bx-controls {right: 0;left: auto;bottom: 60px;} html:lang(ar) .main_slider .bx-controls-direction {right: 0;left: auto;} html:lang(ar) .main_slider .bx-controls-auto {right: 27px;left: auto;padding: 15px 0 15px 48px;} html:lang(ar) #slide-counter {right: 30px;left: auto;} html:lang(ar) .visual > div a {bottom: -80px;} html:lang(ar) .notice .tab_content > ul > li + li {margin: 0 10px 0 0;} html:lang(ar) .flex-box > .cultural-info {margin-right: 10px;} html:lang(ar) .newsletter {padding: 0 20px 40px;} html:lang(ar) .newsletter h3 {font-size: 21px;float: none;} html:lang(ar) .newsletter .right {padding-right: 0;} html:lang(ar) .newsletter .input-box input {text-align: right;} html:lang(ar) .select-box ul li select {height: 35px;line-height: 35px;font-size: 14px;} html:lang(ar) .address-box li:first-of-type {max-width: 88%;} html:lang(ar) .lines-button {left: 0;right: auto;} html:lang(ar) .search-mobile .btnSearch {left: 45px;right: auto;} html:lang(ar) .searchBox-area button.btn-submit {left: 0;right: auto;} html:lang(ar) .menu_close {left: 5px;top: 1px;right: auto;background: url(../../image/front/main/btn_close2_over.png) center 15px no-repeat; background-size: 24px;} html:lang(ar) .btnSearch {left: 55px;right: auto !important;} html:lang(ar) .mb-group .btnhome {left: 115px;right: auto;} html:lang(ar) .mb-group .snsForm > ul {right: 10%;} html:lang(ar) .multiLink > div:first-child {margin-right: 20px;} html:lang(ar) .nav > ul::before {left: auto;right: 0;} html:lang(ar) .nav li.depth01.active .navSub {left: 0; right: 50%; /* width: 210px; */} /* 20230217 width 삭제 */ html:lang(ar) .nav li.depth01 a.depth01Txt {text-align: right;padding: 15px 10px;} html:lang(ar) .nav li.depth01.active a.depth01Txt {background-position: left 10px center;} html:lang(ar) .nav li.depth01 a.depth01Txt:hover, html:lang(ar) .nav li.depth01 a.depth01Txt:focus {background-position: left 10px center;} html:lang(ar) .nav li.depth01.active .navSub li a {text-align: right;} html:lang(ar) .search-mobile .btnSearch {left: 45px;right: auto;} html:lang(ar) .nav li > div > ul {width: 100% !important;} html:lang(ar) .mb-group {max-width: 87%; right: auto !important; left: 0;} } /* mobile Size */ @media screen and (max-width: 767px) { #header {height: 70px;} .logoArea h1 a {width: 140px;height: 70px;background: url(../../image/front/main/logo_btype.png) center center no-repeat;background-size: 120px;padding: 0;} .logoArea h1 a.logoCanada{width: 140px;height: 70px;background: url(../../image/front/main/logo_btype_ca.png) center center no-repeat;background-size: 120px;padding: 0;} /* 20240724 캐나다 로고 추가 */ .mobile-nav {display: block;} .mobile-nav {position: absolute;top: 15px;right: 20px;} .mobile-nav {display: block;} .lines-button {display: block;background: url(../../image/front/main/icon_allMenu_active.png) center center no-repeat;background-size:25px;} .lines-button {position: absolute;right: 0;top: 0;height: 100%;width: 45px;z-index: 999;} .menu_close {display: none;background: url(../../image/front/main/btn_close2_over.png) center 15px no-repeat;background-size: 22px;} .menu_close {position: fixed;right: 10px;top: 0;height: 70px;width: 45px;padding-top: 35px;z-index: 999;font-size: 12px;color: #fff;font-weight: 100;} .menu_close .menu-line {display: block;position: absolute;height: 2px;width: 25px;} .menu_close .menu-line:first-of-type {top: 9px;transform:rotate(315deg);} .menu_close .menu-line:nth-of-type(2) {display: none;} .menu_close .menu-line:nth-of-type(3) {top: 9px;transform:rotate(-315deg);} .menu-line:after, .menu-line:before {position: absolute;top: 0;left: 0;width: 100%;height: 100%;content: "";border-radius: 2px;box-sizing: border-box;background-color: #000;} .search-mobile {display: inline-block;} .search-mobile .btnSearch { display: inline-block;position: absolute;right: 45px;top: 0;height: 100%;width: 45px;border-radius: 0; background: url(../../image/front/main/icon_search_active.png) center center no-repeat;background-size:25px; } .btnSearch, .searchForm.open .btnSearch { height: 70px;width: 55px;padding: 46px 0 0 0;position: absolute;right: 65px;border-radius:0; background: url(../../image/front/main/icon_search2.png) center 15px no-repeat; } .searchForm.open .btnSearch {} .search-mobile.open .btnSearch {background: #c02462 url(../../image/front/main/icon_search_on.png) center center no-repeat;border-radius: 0;} .search-mobile.open .mobilesearchBoxHeader .searchBox-bg {background-color: #c02462;height: 60px;opacity: 1;} .searchBox-area input::placeholder{color:#cfa6b6 !important;} .search-mobile .mobilesearchBoxHeader {top: 70px;z-index: 99;} .searchForm.open .searchBoxHeader .searchBox-bg {height: 60px;} .mb-group .btnSearch .IR, .mb-group .btnhome .IR {width: 100%;height: 20px;font-size: 12px;color: #fff;font-weight: 100;line-height: 1; text-align: center;} .snsForm .btnSns {height: 30px;width: 30px;} .langForm .btnLang {padding: 0 30px 0 0;font-size: 14px;} .langForm .btnLang::after {width: 6px;height: 6px;border-top: 1px solid #121212;border-right: 1px solid #121212;} .mb-group .btnhome {display: inline-block; height: 70px;width: 45px;padding-top: 42px;position: absolute;right: 135px;background: url(../../image/front/main/icon_home_over.png) center 15px no-repeat;} .mb-group .multiLink > div:first-child {padding: 14px 0 0 20px;border-bottom:0} .mb-group .langForm .btnLang { border: 1px solid #fff;min-width: 103px;border-radius: 4px;text-align: left;height: 100%;padding: 0 30px 0 10px;font-size: 15px; line-height: 28px;color: #fff;font-weight: 500;background:transparent url(../../image/front/main/icon_langSelect.png) calc(100% - 10px) center no-repeat; } .mb-group .langForm .btnLang::after {content: none;} .mb-group .snsForm .btnSns {display: none;} .mb-group .snsForm > ul {background: transparent;border: 0;position: fixed;bottom: 20px;top: 90%;right: auto;display: block;width: 180px; left: 34%;} .mb-group .snsForm {position: absolute;left: 10px;bottom: 20px;} .mb-group .snsForm > ul > li {display: inline-block;padding: 0;} .mb-group .snsForm > ul > li + li {margin-left: 5px;} .mb-group .snsForm > ul > li > a {padding: 10px;line-height: 1;} .mb-group .snsForm > ul > li > a span {font-size: 0;text-indent: -9999px;} .mb-group .langForm > ul {top: 43px;right: 0;width: 103px;border-radius: 4px;} .mb-group .langForm > ul > li {padding: 0;} .mb-group .langForm > ul > li > a {padding: 8px 10px;} .mb-group .langForm > ul > li > a:hover {color: #fff;background-color: #1e90ff;} .main_slider {margin: auto 20px;} #mainvisual {height: 500px;} .visual > div a {top: 250px;} .visual .visualText {width: 370px;padding: 25px 0 25px 30px;} .main_slider .bx-wrapper {width: 100%;} .visual > span img {width: 360px;height: 360px;} .visual .title {font-size: 32px;line-height: 48px;height: 46px;} .multiLink {position: absolute;right: 0;top: -70px;margin: 0;height: 70px; background-color: #c02462;padding: 0;width: 100%;box-sizing: border-box;} .searchForm .searchBoxHeader {top: 70px;} .main_slider .bx-controls {top: auto;right: 50px;transform: inherit;bottom: 40px;} #slide-counter {top: auto;right: 145px;transform: inherit;bottom: 28px;} .logoSub {line-height: 1;} .logoSub li {font-size: 12px;} .main_slider {margin: auto;} .visual {padding: 20px;text-align: center;} #mainvisual {height: auto;} .visual > div a {top: auto;bottom: -20px;right: 20px;} .visual .visualText {position: static;width: 100%;padding: 0;} .visual > div a {font-size: 13px;padding: 0 15px 8px 5px;background: url(../../image/front/main/icon_mv_arrowC.png) right bottom no-repeat;background-size: 80px;} .visual > span {width: 100%; height: 168px;} .main_slider .bx-viewport {width: 100%;padding-bottom: 30px;} .visual > span img {width: 100%;height: auto;max-height: 168px;} .visual .title {font-size: 21px;line-height: 24px;} .main_slider .bx-controls-direction {width: 100px;height: 36px;top: auto;left: 50%;transform: translateX(-50%);bottom: -15px;right: auto;} .main_slider .bx-controls-direction .bx-prev {padding: 9px 17px;background-size: 15px;} .main_slider .bx-controls-direction .bx-next {padding: 9px 17px;background-size: 15px;} /* kdy - start */ /* .mb-group {position: fixed;top: 70px;bottom: 0;right: -400px;z-index: 997;max-width: 320px;height: 100%;width: 90%;background-color: #fff;} */ .mb-group {position: fixed;top: 70px;bottom: 0;right: -400px;z-index: 997;max-width: 80%;height: 100%;width: 90%;background-color: #fff; display: none;} /* kdy - end */ .nav {display: block;width: 100%;background-color: #f1f1f1;z-index: 998;} .nav > ul {display: block; min-width: 10px;overflow: hidden;} .nav > ul::before {content: '';display: inline-block;background: #fff;position: absolute; top: 0;bottom: 0;left: 0;width: 50%;} .nav li.depth01 {display: block;float: none;height: auto;} .nav li.depth01.active a.depth01Txt {background:url("../../image/front/main/mobNav_bullet01on.png") calc(100% - 5px) 22px no-repeat;color:#c02462;} .nav li.depth01 a.depth01Txt:hover, .nav li.depth01 a.depth01Txt:focus{ background:url("../../image/front/main/mobNav_bullet01on.png") calc(100% - 5px) 22px no-repeat;color:#c02462; } .nav li.depth01 a.depth01Txt { padding : 15px 10px; width: 50%; text-align: left; box-sizing: border-box; color: #2c2c2c; display: block; background:#fff; font-size: 16px; height: auto; } /* 20230217 padding, height 수정 */ .nav li.depth01 .navSub {left: 160px;top: 0;border-top: 0;box-shadow: none;} .nav li.depth01.active .navSub {left: 50%;top: 0;border-top: 0;box-shadow: none; display: block !important; width: 50%;} /* 20230217 width 추가 */ .nav li.depth01.active .navSub ul li {display: block; line-height: 1; border-bottom: 1px solid #e6e6e6; margin: 0; width: 100%;} /* 20230216 width 수정 */ /* kdy - start */ /* .nav li.depth01.active .navSub li a {display: block;padding: 13px 20px;text-align: left;border-bottom: 1px solid #eee;font-size: 14px;} */ .nav li.depth01.active .navSub li a { display: block;padding: 13px 5px;text-align: left;border-bottom: 1px solid #eee;font-size: 13px; line-height: 1.2em; } /* kdy - end */ .nav li:nth-child(2) > div > ul {width: 100%;} .nav li.depth01 .navSub ul {width: 100%;} .nav ul {display: block !important; min-width: 100px;} /* 20230216 display 추가 */ .nav li.depth01 a.depth01Txt:before {content: none;} .nav li.depth01 a.depth01Txt:after {content: none;} .dimm100 {position: fixed;top: 0;left: 0;z-index: 97;width: 100%;height: 100%;background-color: #000;opacity: 0.8;filter: alpha(opacity=80);} .notice-Board {height: 100%;} .searchForm .searchBoxHeader {top: 70px;} .main_slider .bx-controls {top: auto;left: 50%;transform: translateX(-50%);bottom: 20px;right: auto;} .main_slider .bx-controls-auto {position: absolute;top: auto;padding: 5px 0;transform: translateY(-50%);left: 50%;transform: translateX(-50%);bottom: -15px;right: auto; } #slide-counter {min-width: 35px;top: auto;right: auto;bottom: 10px;left: 30px;transform: translateX(2px);font-size: 14px;line-height: 1;} #slide-counter strong {font-size: 21px;line-height: 1;top: -5px;} .main_slider .bx-controls-auto .bx-controls-auto-item a {background-size: 8px;} .galleryNews .tab_content > p {top: -47px;} .galleryNews > div.tab > ul { width: 100%;height: 100%;display: -webkit-box;display: -ms-flexbox;-webkit-box-orient: horizontal;-ms-flex-direction: row;display: -moz-box;-moz-box-orient: horizontal;display: box;box-orient: horizontal; padding-right: 30px;box-sizing: border-box; } .galleryNews > div.tab > ul li {display: block;-webkit-box-flex: 1;-ms-flex: 1;-moz-box-flex: 1;box-flex: 1;text-align: center;margin-right: 0;} .galleryNews > div.tab > ul li + li {margin-left: 10px;} html:lang(ko) .tab > ul > li > a {font-weight: 500} .galleryNews {width: 100%; padding: 20px 0px 30px;} .galleryNews .tab_content > ul {width: 100%;height: 100%;display: block;overflow: hidden;margin-top: 20px;} .tabs button.active {font-size: 18px;} .tabs button.active:after {bottom: 0;height: 5px;} .tabs button {padding: 15px 0 0 0;font-size: 14px;margin-right: 20px;} .galleryNews .tab_content > ul > li {float: left; width: 48%;padding: 0;} .galleryNews .tab_content > ul > li + li {margin-left: 4%;} .galleryNews .tab_content > ul > li:last-child{display: block;} .galleryNews .tab_content > ul > li:nth-child(3) {margin-left: 0;} .galleryNews .tab_content > ul > li:nth-child(3), .galleryNews .tab_content > ul > li:nth-child(4) {margin-top: 20px;} .galleryNews .tab_content > ul > li:nth-child(2), .galleryNews .tab_content > ul > li:nth-child(4) {float: right;} .galleryNews .tab_content > ul > li a.galleryImg {width: 100%;height: auto; max-width: 100%;} .galleryNews .tab_content > ul > li a.galleryImg img {object-fit: cover;width: 100%;height: 120px;} .galleryTit {font-size: 14px;margin: 5px 0 0 0;} .galleryNews .tab_content > p a {font-size: 13px;padding-right: 25px;} .galleryNews .tab_content > p a::after {width: 15px;height: 3px;top: 18px;} .galleryNews .tab_content > ul > li::after {width: 30px;height: 30px;border-top: solid 5px #1361a6;border-right: solid 5px #1361a6;} .galleryNews .tab_content > ul > li a.galleryBtn {padding: 5px 80px 5px 5px;width: 100%;box-sizing: border-box;font-size: 13px;} .galleryNews .tab_content > ul > li a.galleryBtn::after {width: 5px;height: 5px;top: 11px;right: 10px;} .galleryNews .tab_content > ul > li dl dt {font-size: 14px;} .galleryNews .tab_content > ul > li dl dd {font-size: 13px;margin-bottom: 10px;} .infoArea .infoIcon { position: absolute;top: -10px;left: 0;width: 60px;height: 60px;background: #1361a6 url(../../image/front/main/icon_info.png) center 15px no-repeat;background-size: 30px; } .galleryNews .tab_content .galleryTxt .gallerySubtxt {font-size: 12px} .galleryNews .tab_content .galleryTxt .btnGallery {right: 10px;bottom: 20px;font-size: 12px;padding-right: 10px;} .galleryNews .tab_content .galleryTxt .btnGallery::after {width: 6px;height: 6px;border-top: 1px solid #fff;border-right: 1px solid #fff;top: 6px;left: 59px;} html:lang(ko) .infoArea h1 {font-weight: 700;width: 100%;text-align: left;padding-left: 80px;} .infoArea .infoTxt {display: block;padding: 20px 0 0 20px;} .infoWrap {margin: 30px auto 20px;height: auto;} .infoArea {background-size: cover;padding-left:0;padding-bottom: 10px;} .infoArea .infoTxt dl dt::after {top: 5px;} .infoArea h1 {display: block;padding-top: 15px;font-size: 16px;text-align: center;} .infoArea .infoTxt dl {padding: 5px 0;} .infoArea .infoTxt dl dt {display: block;font-size: 14px;} .infoArea .infoTxt dl dd {display: block;font-size: 13px;} .noticeWrap {padding: 0 20px;} .noticeWrap .noticeArea {width: 100%;float: none;} .noticeWrap .noticeArea + .noticeArea {margin-top: 30px;} .noticeArea h1 {font-size: 16px;} .noticeArea ul {margin-top: 20px;} .noticeArea > p a {width: 20px;height: 20px;background-size: 10px;} .noticeArea ul li a {max-height: 125px;padding: 20px 15px;} .noticeArea ul li a p.date {bottom: 15px;font-size: 13px;} .noticeArea ul li a p.txt {font-size: 13px;line-height: 1.6em;white-space: normal;height: 70px; text-align: left; word-wrap: break-word; display: -webkit-box; display: -ms-flexbox;-webkit-line-clamp: 3; -webkit-box-orient: vertical;-ms-flex-direction: column;overflow: hidden;} .flex-box {display: block;padding: 0 20px;box-sizing: border-box;} .notice {padding: 20px 0 20px 0;} .notice > div.tabs {height: auto; width: 75%;} /* 20230221 width 추가 */ .notice .tabs button.active {font-size: 18px; height: 35px;} .notice .tabs button {padding: 15px 0 2px 0;font-size: 14px;margin-right: 20px;} .notice .tab_content > p a {font-size: 13px;padding-right: 25px;} .notice .tab_content > p a::after {width: 15px;height: 3px;top: 18px;} .notice .tab_content > ul {display: block;margin-top: 20px;} .notice .tab_content > ul > li {box-sizing: border-box;padding: 10px 10px;border: 0;} .notice .tab_content > ul > li:hover {border: 0;} .notice .tab_content > ul > li a {display: block;} .notice .tab_content > ul > li + li {margin: 5px 0 0 0;border-top: 1px solid #c5c5c5;} .notice .tab_content > ul > li + li:hover {border-top: 1px solid #c5c5c5;} .cultural-info .cultural {padding: 20px 10px 20px 10px;} .cultural-info .cultural dl dt {padding-bottom: 15px;font-size: 14px;} .cultural-info .cultural dl dd {font-size: 13px;} .cultural-info .cultural dl + dl {padding-top: 20px;} .tab_content .title {font-size: 14px;min-height: 10px;} .tab_content .date {padding: 5px 0 10px;font-size: 13px;} .tab_content .detail {padding: 3px 20px;font-size: 13px;} .notice .tab_content > p {top: -47px;} .flex-box > .cultural-info {margin-left: 0;max-width: 870px;padding: 0 0 5px 0;} .cultural-info h3 {padding-bottom: 10px;line-height: 1; font-size: 18px;} /* 20230216 font-size 추가 */ .hallyuWrap {margin: 20px auto 0;padding: 20px 0;background-size: 80%;} .hallyuBbs {margin-top: 20px;} .hallyuBanner {margin-top: 30px;padding: 0 20px;box-sizing: border-box;} .hallyuBbs ul {width: 100%;height: 100%;display:block;} .hallyuBbs ul li {display: block;float: none;margin: auto;width: 100%;max-width: 360px;} .hallyuBbs ul li + li {margin: 10px 0 0 0;} .hallyuBbs ul li:last-child {margin: 10px auto;} .hallyuBbs ul li a span {display: block;float: none;width: 100%;max-width: 360px; margin: auto;} .hallyuBbs ul li a dl {display: block;float: none;width: 100%;max-width: 360px; margin: auto;} .hallyuBbs ul li a {height: auto;border: 0;} .hallyuBbs ul li a img {width: 100%;object-fit: cover;height: auto;float: none;} .hallyuBbs ul li a dl dt {height: auto;} .hallyuBbs ul li a dl dd {margin-top: 0;padding-top: 10px;} .hallyuBanner > ul > li {position: relative;width: 100%;margin-right: 0;float: none;} .hallyuBanner > ul > li + li {margin-top: 20px;} .hallyuBanner > ul > li > dl {height: 95px;} .hallyuBanner > ul > li> dl > dd {width: 70%;font-size: 16px;} .hallyuBanner > ul > li > dl.hallyuBanner01 {background: url(../../image/front/main/hallyu_banner01.png) right 20px no-repeat;background-size: 80px;} .hallyuBanner > ul > li > dl.hallyuBanner02 {background: url(../../image/front/main/hallyu_banner02.png) right 20px no-repeat;background-size: 80px;} .hallyuBanner > ul > li > dl.hallyuBanner03 {background: url(../../image/front/main/hallyu_banner03.png) right 20px no-repeat;background-size: 80px;} .hallyuBanner > ul > li > a {position: absolute;bottom: 0;margin: 0;} .hallyuBanner > ul > li > a::after {width: 25px;height: 25px;background-size: 8px;} /* 20230424 백업 .hallyu_banner ul li.banner01 {padding: 50px 5px 5px;background-size: 40px;} .hallyu_banner ul li.banner02 {padding: 50px 5px 5px;background-size: 90px;} .hallyu_banner ul li.banner03 {padding: 50px 5px 5px;background-size: 50px;} .hallyu_banner ul li h4 {font-size: 13px;height: 15px;} .hallyu_banner ul li .txt {padding: 10px 0 5px;font-size: 11px;line-height: 1.4;height: 30%;} .hallyu_banner ul li a {padding-right: 13px;font-size: 13px;background-size: 5px;} */ /* 20230424 온라인 문화원 삭제 start */ .hallyu_banner {padding: 0;} .hallyu_banner::after{width: 95%; height: 1px;} .hallyu_banner ul {-webkit-box-orient: vertical; -moz-box-orient: vertical; box-orient: vertical;} .hallyu_banner ul li{padding: 20px;} .hallyu_banner ul li.banner01 {background: url("../../image/front/main/banner0101_img.png") right 20px center no-repeat; background-size: 65px;} .hallyu_banner ul li.banner02 {background: url("../../image/front/main/banner0202_img.png") right 20px center no-repeat; background-size: 65px;} .hallyu_banner ul li h4 {width: calc(100% - 65px); font-size: 16px;height: auto;} .hallyu_banner ul li .txt {width: calc(100% - 65px); padding: 7px 0 10px; font-size: 15px;line-height: 1.4;height: 30%;} .hallyu_banner ul li a {width: calc(100% - 65px); padding-right: 14px;font-size: 13px;background-size: 5px;} html:lang(ar) .hallyu_banner ul li.banner01 {background: url("../../image/front/main/banner0101_img.png") left 20px center no-repeat; background-size: 65px;} html:lang(ar) .hallyu_banner ul li.banner02 {background: url("../../image/front/main/banner0202_img.png") left 20px center no-repeat; background-size: 65px;} /* 20230424 온라인 문화원 삭제 end */ .hallyuwrap {padding-bottom: 0;} .hallyu_bbs {margin-top: 20px;padding: 0 20px;box-sizing: border-box;} .hallyu_bbs ul {display: block;} .hallyu_bbs ul li a span {display: block;float: none;width: 100%;} /*.hallyu_bbs ul li a img {width: 100%;object-fit: cover;}*/ .hallyu_bbs ul li a dl {display: block;width: 100%;padding: 20px 0;} .hallyu_bbs ul li a {border: solid 0;height: auto;} .hallyu_bbs ul li a:hover {border: 0;} .hallyu_bbs ul li a dl dt {font-size: 15px;} .hallyu_bbs ul li a dl dd {margin-top: 10px;font-size: 13px; height: 38px;line-height: 1.5;} .hallyu_bbs ul li + li {margin-left: 0;} .banner_slider .bx-wrapper .bx-controls .bx-controls-direction {right: 0;} .banner_slider .bx-controls-auto {right: 48px;} .banner_slider .bx-wrapper .bx-controls {right: 20px;} .bannerwrap {padding-bottom: 20px;} /*코리아넷*/ .koreaNews {width:100%; float:none;} .Korea-net-k{width:100%; min-height:185px;} .Korea-net-k .Koreanet-box{height:130px;} .Korea-net-k .Koreanet-box ul li:first-of-type {padding-left: 20px;} .Korea-net-k .Koreanet-box ul li{padding-left: 20px;} .Korea-net-k .Koreanet-box li a .konet-img{display:none;} .Korea-net-k.col4 .koreanet-box ul li{width: 100%;} .Korea-net-k .koreanet-box ul:after {content: '';display: block;clear: both;} .Korea-net-k .Koreanet-box ul li{position: relative; width: 100%;float: none;overflow: hidden;height:28px;} .Korea-net-k .Koreanet-box ul li a {width: 100%; padding-bottom: 0;} .Korea-net-k .Koreanet-box li a .konet-txt{float: left;} .Korea-net-k.height3 .Koreanet-box ul li a .konet-txt{min-height: 20px;font-size:15px;width:75%;float: left;height: 28px;display: inline-block;text-overflow: ellipsis;overflow: hidden;white-space: nowrap;} .Korea-net-k .Koreanet-box li a span.date{position:relative;float:right;white-space: nowrap;font-size:12px;color:#7f7f7f;padding-top: 5px;text-align: left;} .notice-Board {margin: 0;padding: 20px;display: block;box-sizing: border-box;} .notice-Board .koreanet {width: 100%;float: none;} .notice-Board .notice-slider {margin: 20px auto 0 auto; width: 100%; float: none; } .notice-slider .bx-controls {position: absolute;right: 15px;top: 0;} #notice-counter {position:absolute; top: 18px; right: 65px;padding:2px 0; transition:0.3s;font-size: 13px; color: #fff;font-weight: 200;letter-spacing: 2px;z-index: 9;} #notice-counter strong {font-size: 13px;} .newsletter h3 {padding-top: 10px;font-size: 21px;} .newsletter .input-box {width: 100%;height: 100%;display: block;padding: 0 0 10px;} .newsletter .input-box input {display: block;padding: 10px 20px 10px 10px;width: 100%;background: transparent;border-bottom: 2px solid #111;} .newsletter .input-box button {display: block;} .newsletter .btn-news {margin: 10px auto;text-align: center;} .newsletter .input-box input + input {margin: 10px 0 0 0;} .newsletter {padding: 0 20px 40px;} .newsletter h3 {font-size: 18px;float: none;} .newsletter h3::after {bottom: -12px;width: 40px;height: 2px;} .newsletter .right {text-align: left;padding-left: 0;padding-top: 30px;} .select-box {padding: 0 20px;} .select-box ul {padding: 0;border: 1px solid #5c5c5c;} .select-box ul li {float: none;width: 100%;} .select-box ul li + li {border-top: 1px solid #78808b;} .select-box ul li + li:before {content: none;} .newsletter {padding: 0 20px 40px;background: url(../../image/front/main/news_bg.png) 10px 40px no-repeat;} .address-box {padding: 20px 20px 30px;} .address-box ul {padding-top: 30px;} .address-box li:first-of-type {max-width: 100%;} .address-box ul p + p {padding-top: 10px;} .address-box ul p {font-size: 13px; width: 390px;} .address-box .etc a {font-size: 13px;} .address-box .etc {top: 0;transform: inherit;left: 0;} /* kdy - start */ /* 한국어 */ html:lang(ko) .visual .title {font-size: 20px;line-height: 22px;} /* 영어 */ /* html:lang(en) .nav li.depth01.active .navSub ul li {width: 200px;} */ html:lang(en) .nav li.depth01 a.depth01Txt{padding: 15px 20px;} html:lang(en) .galleryNews .tabs button.active {font-size: 18px;width: 115px; } html:lang(en) .galleryNews .tabs button {width: 100px; padding: 15px 0 2px 0;font-size: 14px;margin-right: 20px;} /* 러시아어 */ html:lang(ru) .galleryNews .tab_content .galleryTxt .btnGallery{position: absolute;right: 30px;bottom: 5px; display:inline-block; color:#fff; font-size:14px;padding-right: 10px;} html:lang(ru) .galleryNews .tab_content .galleryTxt .btnGallery::after {content: ''; display:inline-block; position:absolute; width:8px; height:8px; border-top:2px solid #fff; border-right:2px solid #fff; top:6px; left:100px; transform: rotate(45deg); /* 반대각도 315deg 135deg 225deg */} /* 카자흐스탄어 */ html:lang(kk) .galleryNews .tab_content .galleryTxt .btnGallery{position: absolute;right: 30px;bottom: 5px; display:inline-block; color:#fff; font-size:14px;padding-right: 10px;} html:lang(kk) .galleryNews .tab_content .galleryTxt .btnGallery::after {content: ''; display:inline-block; position:absolute; width:8px; height:8px; border-top:2px solid #fff; border-right:2px solid #fff; top:6px; left:100px; transform: rotate(45deg); /* 반대각도 315deg 135deg 225deg */} /* 베트남어 */ html:lang(ru) .galleryNews .tab_content .galleryTxt .btnGallery{right: 30px;} /* 네덜란드어 */ html:lang(nl) .galleryNews .tabs button.active {font-size: 18px;width: 105px; } html:lang(nl) .galleryNews .tabs button {width: 90px; padding: 15px 0 0 0;font-size: 14px;margin-right: 20px;} /* 프랑스어 */ html:lang(fr) .galleryNews .tabs button.active {font-size: 18px;width: 110px; } html:lang(fr) .galleryNews .tabs button {width: 90px; padding: 15px 0 0 0;font-size: 14px;margin-right: 20px;} html:lang(fr) .hallyu_bbs ul li a dl dt {height: 20px;} /* 스페인어 */ html:lang(es) .galleryNews .tabs button.active {font-size: 18px;width: 110px; } html:lang(es) .galleryNews .tabs button {width: 90px; padding: 15px 0 0 0;font-size: 14px;margin-right: 20px;} html:lang(es) .notice .tabs button.active {width: 110px;} html:lang(es) .notice .tabs button {margin-right: 0px; width: 110px;} html:lang(es) .hallyu_banner ul li .txt {height: 38%;} html:lang(es) .visual .title {line-height: 22px;} /* 이탈리아어 */ html:lang(it) .galleryNews .tab_content .galleryTxt .btnGallery::after {left:105px;} /* 인도네시아어 */ /* html:lang(id) .mb-group .langForm .btnLang {padding: 0 23px 0 10px;font-size: 13px;} */ /* html:lang(id) .mb-group .langForm > ul {width: 140px;} */ /* 태국어 */ html:lang(th) .galleryNews .tab_content .galleryTxt .btnGallery::after {left: 50px;} /* 터키어 */ html:lang(tr) .galleryNews .tab_content .galleryTxt .btnGallery::after {left: 75px;} /* 폴란드어 */ /* html:lang(pl) .nav li.depth01.active .navSub ul li {width: 175px;} 20230217 삭제 */ html:lang(pl) .hallyu_banner ul li .txt {height: 40%;} /* 포르투칼어 */ html:lang(pt) .tabs button {width: 110px;} /* 헝가리어 */ html:lang(hu) .notice .tabs button {width: 100px;} html:lang(hu) .notice .tabs button.active {width: 100px;} /* 아랍어어 */ html:lang(ar) .visual .visualText {padding: 0;} html:lang(ar) .galleryNews .tab_content > ul > li + li, html:lang(ar) .galleryNews .tab_content > ul > li:last-child {margin-right: 4%;margin-left: 0;} html:lang(ar) .galleryNews .tab_content > ul > li {float: right;width: 48%;padding: 0;} html:lang(ar) .galleryNews .tab_content > ul > li:nth-child(3) {margin-right: 0;} html:lang(ar) .tabs button {margin: 0 0 0 20px;} html:lang(ar) .tabs button.active {font-size: 14px;} html:lang(ar) .notice-Board .koreanet {float: none;} html:lang(ar) .notice .tab_content > ul > li + li {padding: 10px;margin: 0;} html:lang(ar) .notice .tab_content > ul > li + li {margin: 5px 0 0 0;} html:lang(ar) .flex-box > .cultural-info {margin: 0;} html:lang(ar) .hallyu_bbs ul li a span {float: none;} html:lang(ar) .hallyu_bbs ul li + li {margin: 5px 0 0;} html:lang(ar) .notice-Board .notice-slider {margin: 20px auto 0 auto; float: none;} html:lang(ar) .newsletter h3 {float: none;} html:lang(ar) .newsletter .right {text-align: right;padding-right: 0;padding-left: 0;} html:lang(ar) .newsletter .input-box input + input {margin: 10px 0 0 0;} html:lang(ar) .newsletter .btn-news {margin: 10px auto;} html:lang(ar) .lines-button {left: 0;right: auto;} html:lang(ar) .search-mobile .btnSearch {left: 45px;right: auto;} html:lang(ar) .searchBox-area button.btn-submit {left: 0;right: auto;} html:lang(ar) .searchForm.open .btnSearch {right: auto;} html:lang(ar) .searchForm.open .searchBoxHeader .searchBox-area {width: 88%;} html:lang(ar) .menu_close {left: 0;top: 0;right: auto;background: url(../../image/front/main/btn_close2_over.png) center 15px no-repeat; background-size: 24px;font-size: 11px;} html:lang(ar) .btnSearch {left: 47px; right: auto;} html:lang(ar) .mb-group {max-width: 87%; right: auto !important; left: 0;} html:lang(ar) .mb-group .btnhome {left: 105px;right: auto;} html:lang(ar) .mb-group .snsForm > ul {right: 3%;} html:lang(ar) .multiLink > div:first-child {margin-right: 20px;} html:lang(ar) .nav > ul::before {left: auto;right: 0;} html:lang(ar) .nav li.depth01.active .navSub {left: 0;right: 50%;width: calc(100% - 50%);;} html:lang(ar) .nav li.depth01 a.depth01Txt {text-align: right;padding: 15px 10px;} html:lang(ar) .nav li.depth01.active a.depth01Txt {background-position: left 10px center;} html:lang(ar) .nav li.depth01 a.depth01Txt:hover, html:lang(ar) .nav li.depth01 a.depth01Txt:focus {background-position: left 10px center;} html:lang(ar) .nav li.depth01.active .navSub li a {text-align: right;border-bottom:0} html:lang(ar) .search-mobile .btnSearch {left: 45px;right: auto;} html:lang(ar) .nav li > div > ul {width: 100% !important;} /* html:lang(ar) .mb-group .snsForm > ul {left: 130px;right: auto;} */ html:lang(ar) .galleryNews .tabs button.active {font-size: 18px;width: 105px; } html:lang(ar) .galleryNews .tabs button {width: 90px; padding: 15px 0 0 0;font-size: 14px;margin-left: 20px;} } @media screen and (max-width: 640px) { html:lang(ar) .mb-group .snsForm > ul {right: 0%;} .mb-group .snsForm > ul {left: 38%;} } @media screen and (max-width: 500px) { .mb-group .snsForm > ul {left: 43%;} } @media screen and (max-width: 460px) { html:lang(ar) .mb-group .snsForm > ul {right: -4%;} } /* mobile Size(iPhone 6/7/8 Plus) */ @media screen and (max-width: 414px) { .menu_close { position: fixed; right: 0px; top: 0; height: 70px; width: 45px; padding-top: 33px; z-index: 999; font-size: 12px; color: #fff; font-weight: 300; } .searchForm.open .btnSearch {right: 40px;} .btnSearch {right: 40px;} .mb-group .btnSearch .IR, .mb-group .btnhome .IR {font-size: 12px;} .mb-group .btnhome {right: 90px;} .nav li.depth01 a.depth01Txt {padding: 15px 22px 15px 3px;} .nav li.depth01.active .navSub li a {width: 141px;} .mb-group .snsForm > ul {left: 163px;width: 150px;} .address-box ul p {width: 338px;} label.check span {font-size: 13px;} .notice > div.tabs {height: 33px;} /* 한국어 */ html:lang(ko) .galleryNews .tabs button.active {width: 200px; text-align: left; } html:lang(ko) .galleryNews .tabs button {width: 200px; text-align: left; } /* 영어 */ html:lang(en) .newsletter .right {padding-left: 0%;} html:lang(en) .galleryNews .tabs button.active {width: 250px; text-align: left; } html:lang(en) .galleryNews .tabs button {width: 250px; text-align: left; } /* 프랑스어 */ html:lang(fr) .galleryNews .tabs button.active {width: 250px; text-align: left; } html:lang(fr) .galleryNews .tabs button {width: 250px; text-align: left;} html:lang(fr) .notice > div.tabs { height: 64px; } html:lang(fr) .notice .tabs button.active {width: 265px; text-align: left; } html:lang(fr) .notice .tabs button {width: 265px; text-align: left; } html:lang(fr) .notice .tab_content > p {top: -40px;} html:lang(fr) .notice .tab_content > ul {margin-top: 8px; } html:lang(fr) .hallyu_banner ul li h4 {height: 18px;} html:lang(fr) .hallyu_banner ul li .txt {height: 32%;} /* 네덜란드어 */ html:lang(nl) .galleryNews .tabs button.active {width: 250px; text-align: left; } html:lang(nl) .galleryNews .tabs button {width: 250px; text-align: left; } html:lang(nl) .notice > div.tabs {height: 63px; } html:lang(nl) .notice .tabs button.active {width: 250px; text-align: left;} html:lang(nl) .notice .tabs button {width: 250px; text-align: left;} html:lang(nl) .notice .tab_content > ul {margin-top: 15px; } html:lang(nl) .hallyu_banner ul li .txt {height: 37%;} html:lang(nl) .newsletter {padding: 0 14px 40px;} /* 이탈리아어 */ html:lang(it) .visual > div a {font-size: 12px; padding: 0 4px 8px 5px;} html:lang(it) .tabs button {width: 250px; padding: 15px 0px 0px 0px; text-align: left;} html:lang(it) .galleryNews .tab_content > p {top: -55px;} html:lang(it) .notice > div.tabs {height: 69px;} html:lang(it) .notice .tabs button {width: 250px; padding: 15px 0px 0px 0px; text-align: left;} html:lang(it) .notice .tabs button.active {width: 250px; text-align: left;} html:lang(it) .notice .tab_content > ul {margin-top: 10px;} /* 인도네시아어 */ html:lang(id) .mb-group .multiLink > div:first-child {padding: 14px 0px 0 4px;max-width: 118px;} html:lang(id) .mb-group .langForm .btnLang {display: block;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;} html:lang(id) .mb-group .langForm > ul {width: 117px;} html:lang(id) .searchForm.open .searchBoxHeader .searchBox-area {width: 87%;} /* 태국어 */ /* html:lang(th) .tabs button {font-size: 14px; margin-right: 0px; width: 250px; text-align: left;} */ html:lang(th) .galleryNews .tabs button.active {width: 250px; text-align: left;} html:lang(th) .galleryNews .tabs button {width: 250px; text-align: left;} html:lang(th) .notice > div.tabs {height: 66px;} html:lang(th) .notice .tabs button.active {width: 250px; text-align: left;} html:lang(th) .notice .tabs button {text-align: left; width: 250px;} html:lang(th) .notice .tab_content > ul {margin-top: 12px; } /* 러시아어 */ html:lang(ru) .tabs button {width: 210px; text-align: left;} html:lang(ru) .newsletter .right {padding-left: 0%;} html:lang(ru) label.check span {font-size: 13px; width: 310px;} html:lang(ru) .notice > div.tabs {height: 69px;} html:lang(ru) .notice .tabs button.active {text-align: left; width: 235px} html:lang(ru) .notice .tabs button {text-align: left; width: 235px;} html:lang(ru) .notice .tab_content > ul {margin-top: 0px;} html:lang(ru) .notice .tab_content > p {top: -40px;} html:lang(ru) .hallyu_banner ul li .txt {padding: 12px 0 5px; height: 32%;} /* 카자흐어 */ html:lang(kk) label.check span {font-size: 13px; width: 310px;} html:lang(kk) .newsletter .right {padding-left: 0%;} html:lang(kk) .tabs button {width: 240px; text-align: left;} html:lang(kk) .notice > div.tabs {height: 69px;} html:lang(kk) .notice .tabs button.active {text-align: left; width: 235px} html:lang(kk) .notice .tabs button {text-align: left; width: 235px;} html:lang(kk) .notice .tab_content > ul {margin-top: 0px;} html:lang(kk) .notice .tab_content > p {top: -40px;} html:lang(kk) .hallyu_banner ul li .txt {padding: 12px 0 5px; height: 32%;} /* 헝가리어 */ html:lang(hu) .newsletter .right {padding-left: 0%;} html:lang(hu) .notice > div.tabs {height: 52px; } html:lang(hu) .notice .tab_content > ul {margin-top: -4px; } /* 터키어 */ html:lang(tr) .notice .tabs button {margin-right: 0px; width: 100px;} html:lang(tr) .tabs button.active {width: 100px;} html:lang(tr) .tabs button {margin-right: 10px; width: 100px;} html:lang(tr) .searchForm.open .searchBoxHeader .searchBox-area {width: 85%;} html:lang(tr) .notice > div.tabs {height: 56px;} html:lang(tr) .notice .tab_content > p {top: -72px;} /* 아랍어 */ html:lang(ar) .nav li.depth01.active .navSub ul li {width: 100%;} html:lang(ar) .searchForm.open .btnSearch {right: auto;} html:lang(ar) .searchBox-area input {padding: 15px 10px 9px 10px;} html:lang(ar) .mb-group .snsForm > ul {left: 153px; right: -3%;} html:lang(ar) .galleryNews .tabs button.active {width: 230px; text-align: right;} html:lang(ar) .galleryNews .tabs button {width: 230px; text-align: right;} html:lang(ar) .galleryNews .tab_content > p {top: -35px;} html:lang(ar) .galleryNews .tab_content > ul {margin-top: 6px;} /* 폴란드어 */ html:lang(pl) .notice > div.tabs {height: 68px;} html:lang(pl) .notice .tabs button {width: 130px;} html:lang(pl) .notice .tabs button .active {width: 130px;} html:lang(pl) .notice .tab_content > p {top: -69px;} html:lang(pl) .notice .tab_content > ul {margin-top: 5px;} /* 스페인어 */ html:lang(es) .searchForm.open .searchBoxHeader .searchBox-area {width: 88%;} html:lang(es) .galleryNews .tabs button.active {width: 200px; text-align: left; } html:lang(es) .galleryNews .tabs button {width: 200px; text-align: left; } html:lang(es) .search-mobile.open .mobilesearchBoxHeader .searchBox-area {width: 75%;} html:lang(es) .notice > div.tabs {height: 78px;} html:lang(es) .notice .tab_content > ul {margin-top: -12px; } html:lang(es) .notice .tab_content > p {top: -35px;} html:lang(es) .notice .tabs button {width: 250px; text-align: left;} html:lang(es) .notice .tabs button.active {width: 250px; text-align: left;} /* 포르투칼어 */ html:lang(pt) .tabs button {width: 250px; text-align: left; } html:lang(pt) .notice > div.tabs {height: 65px; } html:lang(pt) .notice .tab_content > ul {margin-top: 0px; } html:lang(pt) .notice .tab_content > p {top: -34px; } /* 베트남어 */ html:lang(vi) .notice > div.tabs {height: 36px;} html:lang(vi) .galleryNews .tabs button.active {width: 250px; text-align: left; } html:lang(vi) .galleryNews .tabs button {width: 250px; text-align: left; } } /* mobile Size(iPhone 6/7/8/X ) */ @media screen and (max-width: 375px) { .mb-group .snsForm > ul {left: 156px;} .search-mobile.open .mobilesearchBoxHeader .searchBox-area {width: 85%;} .searchForm.open .searchBoxHeader .searchBox-area {width: 85%;} /* 영어 */ html:lang(en) .notice > div.tabs {height: 64px;} html:lang(en) .notice .tabs button {width: 250px; text-align: left; } html:lang(en) .notice .tabs button.active {width: 250px; text-align: left; } html:lang(en) .notice .tab_content > ul {margin-top: 15px; } /* 러시아어 */ html:lang(ru) label.check span {font-size: 14px; width: 265px; margin-top: -6px; } /* 카자흐어 */ html:lang(kk) label.check span {font-size: 14px; width: 265px; margin-top: -6px; } html:lang(kk) .tabs button.active {font-size: 15px;} html:lang(kk) .galleryNews .tab_content > ul {margin-top: 16px;} html:lang(kk) .notice .tab_content > ul {margin-top: 3px;} /* 스페인어 */ html:lang(es) .searchForm.open .searchBoxHeader .searchBox-area {width: 92%;} html:lang(es) .searchBox-area input {padding: 15px 27px 9px 2px;} /* 네덜란드어 */ html:lang(nl) label.check span { font-size: 15px; width: 250px; margin-top: -5px; } /* 프랑스어 */ html:lang(fr) .notice .tabs button.active {font-size: 17px;} /* 아랍어어 */ html:lang(ar) .searchForm.open .btnSearch {right: auto;} html:lang(ar) .mb-group .snsForm > ul {left: 125px; right: -5%;} /* 헝가리어 */ html:lang(hu) .visual .title {line-height: 22px;} html:lang(hu) .hallyu_bbs ul li a dl dt {height: 17px;} /* 홍콩어 */ html:lang(hk) .galleryNews .tabs button.active {width: 200px; text-align: left; } html:lang(hk) .galleryNews .tabs button {width: 200px; text-align: left; } /* 터키어 */ html:lang(tr) .visual .title {line-height: 22px;} html:lang(tr) .searchForm.open .searchBoxHeader .searchBox-area {width: 91%;} html:lang(tr) .galleryNews .tabs button.active {width: 250px; text-align: left; } html:lang(tr) .galleryNews .tabs button {width: 250px; text-align: left; } html:lang(tr) .notice .tabs button {width: 250px; text-align: left;} html:lang(tr) .notice .tabs button.active {width: 250px; text-align: left;} html:lang(tr) .notice > div.tabs {height: 67px;} html:lang(tr) .notice .tab_content > ul {margin-top: 0px;} html:lang(tr) .notice .tab_content > p {top: -34px;} /* 폴란드어 */ html:lang(pl) .notice .tabs button {width: 250px; text-align: left;} html:lang(pl) .notice .tabs button.active {width: 250px; text-align: left; height: 40px;} html:lang(pl) .notice .tab_content > p {top: -36px;} } /* mobile Size(iPhone 5/SE ) */ @media screen and (max-width: 320px) { .address-box ul p {width: 280px;} /* 영어 */ html:lang(en) label.check span {font-size: 13px; width: 250px; margin-top: -7px;} html:lang(en) .nav li.depth01.active .navSub li a {width: 120px;} /* 러시아어 */ html:lang(ru) .nav li.depth01.active .navSub li a {width: 125px;} html:lang(ru) .visual > div a {padding: 0 1px 8px 5px;} html:lang(ru) .galleryNews .tab_content > p {top: -35px;} html:lang(ru) label.check span {width: 250px;} /* 스페인어 */ html:lang(es) .galleryNews .tab_content > p {top: -36px;} }