/* mobile device */ @media all and (max-width:640px) { #header .eng {display:none;} #container .contents {background:#fff;} #container .contents .top {display:none;} #container .contents .topmver {display:block; padding:0 0 20px;} #container .contents .topmver select {width:100%; padding:5px 0 5px 5px; font-size:15px; font-family:'Dotum'; border:solid 1px #b0b0b0;} #container .contents .topmver select option.none {display:none;} /* megamenu */ #container .topC {height:80px;} #mega {display:none;} /*#container .topC #mega {display:none;} #mega .mega1 ul li.cmm1 {width:100%;} #mega .mega1 ul li.cmm2 {display:none;} #mega .mega2 ul.prdct {background:none;} #mega .mega2 ul.prdct li {width:33%;} #mega .mega2 ul.prdct li.pct1 {display:none;} #mega .mega3 {max-width:340px;} #mega .mega3 .irM {width:160px;} #mega .mega3 .irM li {width:92%; padding-left:8%; background:none;} #mega .mega3 .irM li.im2 {display:none;} #mega .mega4 {max-width:370px;} #mega .mega4 ul.prM {width:150px;} #mega .mega4 .prM li {width:100%; background:none;} #mega .mega4 .prM li.pm2 {display:none;} #mega .mega5 {width:100%;} #mega .mega5 ul {background:none;} #mega .mega5 ul li.m5_1 {float:none; width:100%; margin:0 auto; padding-left:15%; width:55%;} #mega .mega5 ul li.m5_1 span.go {left:79%;} #mega .mega5 ul li.m5_2 {display:none;} #mega .mega6 {max-width:400px;} #mega .mega6 .dkmt {display:none;} #mega .mega6 .rjp {width:95%;} #mega .mega6 .rjp .itvw p {width:80%;}*/ /* company */ #container .contents.company .detail .comt {background-position:0 10%; padding-bottom:50px;} #container .contents.company .detail .comt span.w5 {padding-bottom:40px; float:none; width:100%;} #container .contents.company .detail .comt span.w5 img {width:100%; max-width:319px;} #container .contents.company .detail .comt span.vimg {float:none; width:100%;} #container .contents.company .detail .tcon {border-bottom:none;} #container .contents.company .detail .tcon .tcl {float:none; width:100%; padding:0; border-right:none;} #container .contents.company .detail .tcon .tcr {float:none; width:100%; padding:0; margin-top:35px;} #container .contents.company .detail .bcon {padding:0; background:none;} #container .contents.company .detail .bcon p.tt {width:100%;} #container .contents.history .detail .tit {margin-left:5%;} #container .contents.history .detail .tit.ml0 {margin-left:0;} #container .contents.history .detail .h_btn {right:10%; z-index:10;} #container .contents.history .detail .h_btn.rl5 {right:5%;} #container .contents.history .detail .mhistory {display:block; padding:20px 5% 0;} #container .contents.history .detail .mhistory select {width:100%; margin-top:10px; padding:5px 0 5px 5px; font-size:13px; font-family:'Dotum'; border:solid 1px #b0b0b0;} #container .contents.history .detail .mhistory.plr0 {padding:20px 0 0;} #container .contents.history .detail .history ul {margin-top:20px;} #container .contents.history .detail .history li em {display:none;} #container .contents.history .detail .history li.t01.on, #container .contents.history .detail .history li.t02.on, #container .contents.history .detail .history li.t03.on {background:none;} #container .contents.history .detail .history .dtxt {margin-left:0; border-left:none; padding:17px 20px 35px;} #container .contents.history .detail .history .dtxt .hy li {margin-bottom:10px;} #container .contents.history .detail .history .dtxt p img {text-align:center;} #container .contents.history .detail .history .yhi {margin-top:30px;} #container .contents.history .detail .history .yhi ul li {margin-bottom:10px; margin-right:35px;} #container .contents.history .detail .history .yhi ul li span.bold {display:block;} #container .contents.principle .detail .priul li {padding-bottom:40px; clear:both; color:#636363; overflow:hidden;} #container .contents.principle .detail .priul li img {float:none; margin-right:0; padding:0;} #container .contents.principle .detail .pritp {/*padding-bottom:30px;*/} #container .contents.principle .detail .pritp span.w5 {display:block; float:none; width:100%;} #container .contents.principle .detail .pritp span.vimg {display:block; float:none; width:80%; margin-top:40px;} /*#container .contents.ceo .ceot {padding:60px 5% 40px;} #container .contents.ceo .ceot img.f_l {display:none;} #container .contents.ceo .ceot .ctxt {margin:50px 0 0 0;}*/ #container .contents.ceo .top {display:none;} #container .contents.ceo .detail .mceo {display:block; padding:20px 0 0;} #container .contents.ceo .detail .mceo select {width:100%; padding:5px 0 5px 5px; font-size:15px; font-family:'Dotum'; border:solid 1px #b0b0b0;} #container .contents.ceo .ceot .cop.c1 img {max-width:288px; width:100%;} #container .contents.ceo p.m {display:block;} #container .contents.ceo p.p {display:none;} #container .contents.network .detail .mapif .mimg {padding:0 0 20px;} #container .contents.network .detail .mapif .mimg .bmap, #container .contents.network .detail .mapif .mimg .asiamap {display:none;} #container .contents.network .detail .mmap {display:block; padding:20px 0 0;} #container .contents.network .detail .mmap select {width:100%; padding:5px 0 5px 5px; font-size:15px; font-family:'Dotum'; border:solid 1px #b0b0b0;} #container .contents.network .detail .korm {display:none;} #container .contents.network .detail .form {display:none;} #container .contents.network .detail .overflow {margin-top:30px;} #container .contents.network .detail .overflow .f_l {width:100%; float:none;} #container .contents.network .detail .overflow .f_r {width:100%; float:none; margin-top:30px;} #container .contents.network .detail .mapif .minfo {padding:0 0 20px; min-height:0;} #container .contents.network .detail .mapif .mimg.korea {padding-left:0;} #container .contents.network .detail .ggmif .tfa {margin:20px 10px 30px;} #container .contents.network .detail .mapif .mimg .americamap {display:none;} #container .contents.company .detail .dops a.ci {position:relative; top:7px; left:0; display:block;} #container .contents.company .detail .cdet.sig img.engsi {max-width:259px; width:100%;} #container .contents.company .detail .cdet .cdl dt {float:left;} #container .contents.ferrum .visual {display:none;} #container .contents.ferrum .detail .floor {display:none;} #container .contents.ferrum .detail .overview .fst .mflor {display:block; padding:20px 0 0;} #container .contents.ferrum .detail .overview .fst .mflor select {width:100%; padding:5px 0 5px 5px; font-size:15px; font-family:'Dotum'; border:solid 1px #b0b0b0;} #container .contents.ferrum .detail .overview .fst .ovL {float:none; width:100%;} #container .contents.ferrum .detail .overview .fst .ovR {float:none; width:100%; margin-top:20px;} #container .contents.ferrum .detail .overview .fst .ovR .f_info {margin-left:0;} #container .contents.ferrum .detail .overview .fst .ovR .f_info ul li {padding-left:0;} #container .contents.ferrum .detail .overview .fst .ovR .f_info ul li .flr .btip {display:none;} /* product */ #container .contents.product .detail ul.tab {display:none;} #container .contents.product .detail .m_pro {display:block; padding-bottom:20px;} #container .contents.product .detail .m_pro select {width:100%; padding:5px 0 5px 5px; font-size:15px; font-family:'Dotum'; border:solid 1px #b0b0b0;} #container .contents.product .detail .title {font-size:29px; line-height:29px;} #container .contents.product .detail .cftab {display:none;} #container .contents.product .detail span.sbr {display:block;} /* ir #container .contents.ir .tbl col.pdfd {width:40%;}*/ #container .contents.ir .tbl col.rnum {width:0; display:none;} #container .contents.ir .tbl col.mana {width:70%;} #container .contents.ir .tbl th.fir, #container .contents.ir .tbl td.fir {display:none;} #container .contents.ir .tbl th, #container .contents.ir .tbl td.title {border-left:solid 1px #d0d4d7;} /*#container .contents.ir .detail .ir_tbl col {width:30%;}*/ #container .contents.ir .top {display:none;} #container .contents.ir .detail .msmr {display:block; padding:0 0 30px;} #container .contents.ir .detail .msmr select {width:100%; padding:5px 0 5px 5px; font-size:15px; font-family:'Dotum'; border:solid 1px #b0b0b0;} #container .contents.ir .detail .summary .smr_tit img.mgl10 {margin-left:0; display:block; margin-top:5px;} /*#container .contents.ir .detail .ir_tbl .none { visibility:hidden; width:0; display:none; }*/ /* contact */ #container .contents.cyber .detail .info img.fimg {max-width:479px; width:100%;} #container .contents.cyber .detail .mctt, #container .contents.contact .detail .mctt {display:block; padding:0 0 20px;} #container .contents.cyber .detail .mctt select, #container .contents.contact .detail .mctt select {width:100%; padding:5px 0 5px 5px; font-size:15px; font-family:'Dotum'; border:solid 1px #b0b0b0;} #container .contents.contact .agree .agbox {padding:5px;} #container .contents.contact .tbl2 col.dc1 {width:90px;} #container .contents.contact .tbl2 th {padding:15px 5px;} #container .contents.contact .tbl2 td {padding:10px 3%;} #container .contents.contact .tbl2 a {margin:5px 0 0; display:block;} #container .contents.contact .tbl2 span.dpbk {display:block; padding-left:0;} #container .contents.contact .tbl2 input.txt {width:90%;} #container .contents.contact .tbl2 textarea.txt {width:90%;} #container .contents.contact .tbl2 select.num {width:25%;} #container .contents.contact .tbl2 input.num {width:25%;} /* pr */ #container .contents .detail .paging.wb {display:none;} #container .contents .detail .paging.mb {display:block;} #container .contents.pr .detail .n_list dl dt {display:none;} #container .contents.pr .detail .n_list dl dd p.title {margin-bottom:0;} #container .contents.pr .detail .n_list dl dd span.data {position:relative; margin-bottom:10px; display:block;} #container .contents.pr .detail .recent dl dd p.title, #container .contents.pr .detail .n_list dl dd p.title {width:95%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal;} #container .contents.pr .detail ul.print {text-align:center;} #container .contents.pr .detail ul.print li.f_l {float:none;} #container .contents.pr .detail ul.print li.f_r {float:none;} #container .contents.pr .detail ul.print img {max-width:301px; width:100%;} #container .contents.pr .detail .print .pub {margin:0 auto; max-width:340px;} #container .contents.pr .detail .print .pub .list {float:none; width:100%; max-width:318px; margin-top:30px;} #container .contents.pr .detail .print .pub .c_b {float:none; width:100%;} #container .contents.pr .detail .print .pub .report {float:none; width:100%; margin-top:30px;} #container .contents.pr .detail .print .pub img.cver {width:100%;} #container .contents.pr .detail .print .pub .prtit {height:auto;} #container .contents.pr .detail p.tit.tit2 {margin-top:30px;} #container .contents.pr .detail .prview dt {float:none;} #container .contents.pr .detail .prview dd {float:none; margin-top:15px;} #container .contents.pr .detail .view p.title {/*overflow:hidden; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal;*/ padding:20px 5px;} #container .contents.pr .detail .view p.title span {position:relative; left:0; top:10px; display:block;} #container .contents.pr .detail .lipaging {display:none;} /* recruit */ #container .contents.recruit ul .top {display:none;} #container .contents.recruit .detail .pem0 {display:none;} #container .contents.recruit .detail .pem1 {display:block;} #container .contents.recruit .detail .pem1 img.txti {width:100%; max-width:640px;} #container .contents.recruit .detail .mpst {display:block; padding:0 0 20px;} #container .contents.recruit .detail .mpst select {width:100%; padding:5px 0 5px 5px; font-size:15px; font-family:'Dotum'; border:solid 1px #b0b0b0;} #container .contents.recruit .tbl th.fir.ps, #container .contents.recruit .tbl td.fir.ps {display:none;} #container .contents.recruit .tbl col.r1 {display:none; width:0;} #container .contents.recruit .tbl col.r3 {width:29%;} #container .contents.recruit .tbl col.r4 {width:18%;} #container .contents.recruit .tbl th.title, #container .contents.recruit .tbl td.title {border-left:solid 1px #d0d4d7;} #container .contents.recruit .tbl td span.blk {display:block;} #container .contents.recruit .detail .benef li .ti {float:none;} #container .contents.recruit .detail .pes1 {background:none;} #container .contents.recruit .detail .tsect {background:none;} /* CSR */ #container .contents.nanum .detail .nnbox {background:none;} #container .contents.nanum .detail .nnbox p img {width:100%;max-width:328px;} #container .contents.nanum .detail .nnbox p.mgt25 img {max-width:323px;} #container .contents.csr .detail .contri {background:none;padding-left:0;} #container .contents.csr .detail .ctrli {margin-top:40px;} #container .contents.csr .detail .ctrli .f_l, #container .contents.csr .detail .ctrli .f_r {float:none; width:100%;} #container .contents.csr .detail .ctrli .f_r {margin-top:40px;} #container .contents.csr .detail .ctrli img.mgt15 {max-width:296px; width:100%;} #container .contents.csr ul .top {display:none;} #container .contents.csr .detail .mcp {display:block; padding:0 0 20px;} #container .contents.csr .detail .mcp select {width:100%; padding:5px 0 5px 5px; font-size:15px; font-family:'Dotum'; border:solid 1px #b0b0b0;} #container .contents.csr .detail .cp .cpw {display:none;} #container .contents.csr .detail .cp .cpm {display:block;} #container .contents.csr .detail .cp .cpm img.fimg {max-width:640px; width:100%;} #container .contents.csr .detail .cp .cpd .f_l {width:100%; float:none;} #container .contents.csr .detail .cp .cpd .f_r {width:100%; float:none; margin-top:30px;} #container .contents.env .detail .eviw {display:none;} #container .contents.env .detail .evim {display:block;} #container .contents.env .detail .evim img.evimg {max-width:639px; width:100%;} #container .contents.csr .detail .cpt {background:none;} #container .contents.csr .detail .ceom .f_l {width:100%; float:none;} #container .contents.csr .detail .ceom .f_r {width:100%; float:none; margin-top:20px;} #container .contents.concert .detail .tbl col.th {width:32%;} #container .contents.concert .detail .tbl col.td {width:68%;} #container .contents.concert .detail .tbl td select {width:90%;} #container .contents.concert .detail .tbl td select.sel1 {width:90%;} #container .contents.concert .detail .tbl td select.sel2 {width:30%;} #container .contents.concert .detail .tbl td input {margin-bottom:5px; width:85%;} #container .contents.concert .detail .tbl td input.inp1 {width:20%;} #container .contents.concert .detail .ferrum .con .progress {float:none; width:100%;} /*#container .contents.concert .detail .ferrum .con .review {float:none; width:100%; max-width:100%;}*/ #container .contents.concert .detail .ferrum .con .review p {margin-top:30px;} #container .contents.concert .detail .ferrum .con .review ul.thum {overflow:hidden; clear:both; margin:10px auto 0;} /*#container .contents.concert .detail .ferrum .con .review ul.thum li {float:left; width:24%; margin-right:1.25%;}*/ #container .contents.concert .detail .ferrum .con .review ul.thum li.last {float:right; margin-right:0;} #container .contents.concert .detail .ferrum .con .review ul.thum img {max-width:100%;} #container .contents.concert .detail .ferrum .psb p.btn a.join, #container .contents.concert .detail .psb p.btn a.join {display:none;} #container .contents.concert .detail .ferrum .psb p.btn {top:5px; margin-left:0;} #container .contents.concert .detail .ferrum .con .review span.cbtn {top:-3px;} #container .contents.concert .detail .psb p.btn {position:relative; left:0; top:5px;} #container .contents.concert .detail .view p.title {padding-right:0;} #container .contents.concert .detail .view p.title span {position:relative; right:0; top:5px; left:0;/*text-align:right;*/display:block;} .replyS .wrpl {padding:20px 10px;} .replyS .rep li {text-align:left;padding-right:0;} /*.replyS .rep li .date {position:relative; right:0; top:0;text-align:right;}*/ .replyS .rep li .rpw span.msct {right:-4px;} .replyS .rep li .rpw a {padding:0 3px;} .replyS .rep li input.rwi {width:75%;} /*.replyS .rep li .remanage {position:absolute; top:0; left:115px;}*/ .replyS .wrpl p.tit {position:relative;width:auto;top:0;left:0;} .replyS .wrpl p.tit a {position:absolute;right:4px; top:-6px;} .replyS .wrpl .write {margin:15px 0 0;} .replyS .wrpl .write .txt .txar {margin-right:92px;} #container .contents.pr .detail .replyS .wrpl .write a.btn {display:none;} #container .contents.pr .detail .replyS .wrpl .write label {display:block; margin-top:5px} #container .contents.pr .detail .replyS .wrpl .write label span.rnm {width:50px; display:inline-block;} #container .contents.concert .detail .lipaging li .prev, #container .contents.concert .detail .lipaging li .next {padding:0;width:60px;} #container .contents.concert .detail .lipaging li span {display:none;} #container .contents.concert .detail .lipaging li .title {float:none;padding-left:75px;} #container .contents.concert .detail .lipaging li .title a {display:block;overflow:hidden;text-overflow: ellipsis;white-space: nowrap;word-wrap: normal;} /* member */ #wrapper.member.join2 #layout .contents.member {display:none;} #wrapper.member.join2 #layout .mjoin, #wrapper.member #layout .mtxt, #wrapper.member #container .mmodi {text-align:center; background:yellow; padding:300px 0; display:block;} #wrapper.member.join2 #layout .mjoin p, #wrapper.member #layout .mtxt p, #wrapper.member #container .mmodi p {width:90%; margin:0 auto; font-size:20px; line-height:30px;} .mno {display:none;} #container .contents.member .detail .join .info col.th {width:32%;} #container .contents.member .detail .join .info col.td {width:68%;} #container .contents.member .detail .join .info td a img {margin-top:5px;} #container .contents.member .detail .join .info td a img.btn {margin-top:0;} #container .contents.member .detail .join .info input.txt {width:85%; vertical-align:middle;} #container .contents.member .detail .join .info input.txt1 {width:80%; vertical-align:middle; margin-bottom:5px;} #container .contents.member .detail .join .info input.txt2 {width:20%; /*vertical-align:middle; margin-top:5px;*/} #container .contents.member .detail .join .info input.txt3 {width:90%;} #container .contents.member .detail .join .info span.stxt {font-size:11px; display:block; margin-top:4px;} #container .contents.member .detail .join .info select {width:89%;} #container .contents.member .detail .join .info select.sel2 {width:30%;} #container .contents.member .detail .join .info select.mgr5 {margin-bottom :5px; vertical-align:middle;} #container .contents.member .detail .join .info input.chk {vertical-align:-2px;} #container .contents.member .detail .join .info input#sms {margin-left:7px;} #container .contents.member .detail .join .info label.email {margin-right:15px;} #container .contents.member .detail .join .info span.ip {display:block;} #container .contents.member .detail .join .info span.ip.mgl10 {margin-left:0;} #container .contents.member .detail .jst3 {background:none; padding:35px 5%;} /*#container .contents.member .detail .login .lbg {display:none;} #container .contents.member .detail .login .box {width:100%; float:none;}*/ #container .contents.member .detail .login {background:none; margin:10px auto 50px;} #container .contents.member .detail .login .box {margin-left:0; border-left:0;} #container .contents.member .detail .login .box .bot span.mgl20 {display:none;} #container .contents.member .detail .login .box p.txt span {display:none;} #container .contents.find .detail {padding-bottom:70px;} #container .contents.find .detail .tbl td input.txt1 {width:85%; margin-bottom:5px;} #container .contents.find .detail .tbl td select {margin-top:0; width:89%;} #container .contents.find .detail .tbl td input {width:85%;} #container .contents.find .detail .tbl td input.txt2 {width:20%;} #container .contents.find .detail .tbl td select.sel {width:30%;} #layout .contents.mypage {display:none;} #container .contents.mypage .detail .tbl col.col1 {width:0%; display:none;} #container .contents.mypage .detail .tbl col.col2 {width:35%;} #container .contents.mypage .detail .tbl col.col3 {width:23%;} #container .contents.mypage .detail .tbl col.col4 {width:30%;} #container .contents.mypage .detail .tbl col.col5 {width:12%;} #container .contents.mypage .detail .tbl th.no1, #container .contents.mypage .detail .tbl td.no1 {display:none;} #container .contents.mypage .detail .tbl th.tit {border-left:solid 1px #d0d4d7;} #container .contents.mypage .detail .tbl td {padding:8px 5px;} #container .contents.mypage .detail .tbl td.tit {border-left:solid 1px #d0d4d7;} #container .contents.mypage .detail .tbl td span.time {display:block;} #container .contents.mypage .detail .tbl td span.ip {display:block;} #container .contents.mypage .detail .tbl td span.ip.mgl10 {margin-left:0;} #container .contents.mypage .detail .tbl td span.ip input {vertical-align:top;} #container .contents.mypage .detail .tbl col.th {width:40%; min-width:118px;} #container .contents.mypage .detail .tbl col.td {width:60%;} #container .contents.mypage .detail .tbl th.left, #container .contents.mypage .detail .tbl th.fir, #container .contents.mypage .detail .tbl th.fin {padding:8px 5px;} #inquiry .pop .xscr {} /* 주소검색 팝업 #address .pop {width:90%;} #address .pop .txt .search input.sch {width:75%;}*/ /* sitemap */ #container .contents.sitemap {display:none;} #wrapper.sitemap #layout .mstm{text-align:center; background:yellow; padding:300px 0; display:block;} #wrapper.sitemap #layout .mstm p {width:90%; margin:0 auto; font-size:20px; line-height:30px;} /* footer */ #footer {padding-bottom:20px;} #footer .copy address {margin-top:10px;} #footer .f_site {float:left; left:0;} #footer .f_menu .last {display:none;} .replyS .wrpl p.tit a {display:none;} #replypop {display:none; z-index:-100;} } @media all and (max-width:520px) { #container .contents.company .detail .cdet .cdl {overflow:hidden; clear:both; width:90%;} #container .contents.company .detail .cdet .f_l.cdl {float:none;} #container .contents.company .detail .cdet .f_r.cdl {float:none; margin-top:15px;} } /* mobile device (portrait & landscape mode) 320~480 */ @media all and (max-width:480px) { /*320까지는 고려안하기로 했지만 max width를 주거나 overflow-x등으로 스크롤이슈등을 처리할것!!! ㅋ*/ #mega .mega5 ul li.m5_1 {padding-left:20%;} /* company */ #container .contents.history .detail .h_btn {/*right:25px;*/ top:100px; left:10%;} #container .contents.history .detail .h_btn.rl5 {top:100px; left:5%;} #container .contents.history .detail .mhistory {display:block; padding:50px 5% 0;} #container .contents.history .detail .mhistory.plr0 {padding-top:50px;} .cit span.dkblue, .cit span.red {display:block; margin-top:10px;} /* ir */ #container .contents.product .detail .cert {overflow-x:scroll;padding-bottom:20px;} /* pr */ #container .contents.pr .detail .prview dd a {padding:20px 44px 18px; margin:0 10px 10px 0; background-position:85px 25px;} #container .contents.pr .detail .prview dd a.last {padding:20px 32px 18px; margin-bottom:10px; background-position:95px 25px;} #container .contents.pr .detail .prview dd a.on {background-position:85px 25px;} #container .contents.pr .detail .prview dd a.on.last {background-position:95px 25px;} #container .contents.pr .detail .prview.bdn dd a {padding:20px 44px 18px; margin:0 10px 10px 0; background-position:85px 24px;} #container .contents.pr .detail .prview.bdn dd a.last {padding:20px 32px 18px; margin-bottom:10px; background-position:95px 24px;} /* member */ #container .contents.member .detail .login .box .lgi dl {float:none; width:100%; clear:both; overflow:hidden;} #container .contents.member .detail .login .box .lgi dl dt {width:30%;} #container .contents.member .detail .login .box .lgi dl dd {width:70%;} #container .contents.member .detail .login .box .lgi p.btn {float:none; width:100%; text-align:center; margin-top:20px;} /* footer */ #footer .copy {padding:40px 5% 70px;} /*#footer .copy address span.tel {display:block;} #footer .copy .f_txt span.arr {display:block;} */ #footer .f_site {margin-top:15px;} } @media all and (max-width:460px) { #mega .mega4 {max-width:300px; width:100%;} #mega .mega4 .press {background:none; width:100%;} #mega .mega4 ul.prM {display:none;} #mega .mega6 .rjp .itvw p {width:45%;} } @media all and (max-width:440px) { #container .contents.company .detail .cdet .f_l.cdl {margin:0 auto; width:63%;} #container .contents.company .detail .cdet .f_r.cdl {margin:15px auto 0; width:63%;} #container .contents.company .detail .cdet .cdl dt {float:none; text-align:center;} #container .contents.company .detail .cdet .cdl dd {float:none;} } @media all and (max-width:420px) { /*#container .contents.product .detail .title {font-size:45px; line-height:45px;}*/ #container .contents.env .detail .climate dl dt {width:20%;} #container .contents.env .detail .climate dl dd {width:75%; font-size:11px; line-height:1.35em;} #container .contents.env .detail .certification li img {max-width:161px; width:100%;} #container .contents.env .detail .certification li.f, #container .contents.env .detail .certification li.b {margin-right:1%; width:49%} #container .contents.env .detail .certification li.a, #container .contents.env .detail .certification li.c {margin-left:1%; width:49%} #container .contents.csr .detail .found .dtil img.bi {max-width:305px; width:95%;} #container .contents.csr .detail .found .dtil img.st {max-width:299px; width:95%;} #container .contents.csr .detail .found .f_r img {max-width:326px; width:95%;} /* recruit */ #container .contents.recruit .detail .benef li img {float:none;} } @media all and (max-width:400px) { #container .contents.talent .detail .rtop .stxt img {max-width:330px; width:100%;} #container .contents.talent .detail .rle ul li.f_l, #container .contents.talent .detail .rle ul li.f_r {float:none;} #container .contents.talent .detail .rri {width:100%;} #container .contents.talent .detail .rri .f_l, #container .contents.talent .detail .rri .f_r {float:none; width:160px; margin-top:30px;} } @media all and (max-width:360px) { #container .contents.ferrum .detail .Dfloor ul li img {float:none;} } @media all and (max-width:340px) { #container .contents .detail .search input {width:135px;} }