@charset "utf-8";
#portfolio .navDisplay #gnb > ul li a { color: #121212; font-weight: 500; transition: .3s; }
#portfolio .navDisplay #gnb > ul li a:hover { color: #fff; }
#portfolio .navDisplay #gnb > ul li .on { color: #fff; }
#portfolio .navDisplay #gnb > ul > li:hover > a { color: #fff }
#portfolio .navDisplay #gnb > ul > li:hover > a:active { color: #fff }
#portfolio .navDisplay #gnb > ul > li > a:after { background-color: #121212; }
#portfolio .navDisplay #gnb > ul > li:hover > a { color: #fff !important }
#portfolio .navDisplay #gnb > ul > li:hover ul li a { color: #ccc; }
#portfolio .navDisplay #gnb > ul > li ul li a:active { color: #666; }
#portfolio .navDisplay #gnb > ul > li:hover ul li a:hover { color: #fff }
#portfolio .navDisplay #gnb.active ul li a { color: #ccc }
#portfolio .navDisplay #gnb.active > ul > li > a:after { background-color: #fff; }
#portfolio .navDisplay #gnb ul li.active a { color: #ccc }
#portfolio .navDisplay #gnb ul li ul li a { color: #ccc; }
#portfolio .navDisplay #gnb ul li ul li a em { background: rgba(255, 255, 255, 0); }
#portfolio .navDisplay #gnb ul li ul li a em::after { background: rgba(255, 255, 255, 0); }
#portfolio .navDisplay #gnb ul li ul li a:hover em::after { background: rgba(255, 255, 255, .7); }
#portfolio .navDisplay #gnb ul li ul li.active a { color: #666; }
#portfolio .navDisplay #gnb ul li ul li a:hover, #about_us #gnb ul li ul li a:focus { color: #666; }
#portfolio .navDisplay #head.active #logo a.logo { background: url(../images/common/logo2.svg) left top no-repeat; background-size: 100% auto; }
#result .navDisplay #gnb > ul li a { color: #121212; font-weight: 500; transition: .3s; }
#result .navDisplay #gnb > ul li a:hover { color: #fff; }
#result .navDisplay #gnb > ul li .on { color: #fff; }
#result .navDisplay #gnb > ul > li:hover > a { color: #fff }
#result .navDisplay #gnb > ul > li:hover > a:active { color: #fff }
#result .navDisplay #gnb > ul > li > a:after { background-color: #121212; }
#result .navDisplay #gnb > ul > li:hover > a { color: #fff !important }
#result .navDisplay #gnb > ul > li:hover ul li a { color: #ccc; }
#result .navDisplay #gnb > ul > li ul li a:active { color: #666; }
#result .navDisplay #gnb > ul > li:hover ul li a:hover { color: #fff }
#result .navDisplay #gnb.active ul li a { color: #ccc }
#result .navDisplay #gnb.active > ul > li > a:after { background-color: #fff; }
#result .navDisplay #gnb ul li.active a { color: #ccc }
#result .navDisplay #gnb ul li ul li a { color: #ccc; }
#result .navDisplay #gnb ul li ul li a em { background: rgba(255, 255, 255, 0); }
#result .navDisplay #gnb ul li ul li a em::after { background: rgba(255, 255, 255, 0); }
#result .navDisplay #gnb ul li ul li a:hover em::after { background: rgba(255, 255, 255, .7); }
#result .navDisplay #gnb ul li ul li.active a { color: #666; }
#result .navDisplay #gnb ul li ul li a:hover, #about_us #gnb ul li ul li a:focus { color: #666; }
#result .navDisplay #head.active #logo a.logo { background: url(../images/common/logo2.svg) left top no-repeat; background-size: 100% auto; }
#contact_us .navDisplay #gnb > ul li a { color: #121212; font-weight: 500; transition: .3s; }
#contact_us .navDisplay #gnb > ul li a:hover { color: #fff; }
#contact_us .navDisplay #gnb > ul li .on { color: #fff; }
#contact_us .navDisplay #gnb > ul > li:hover > a { color: #fff }
#contact_us .navDisplay #gnb > ul > li:hover > a:active { color: #fff }
#contact_us .navDisplay #gnb > ul > li > a:after { background-color: #121212; }
#contact_us .navDisplay #gnb > ul > li:hover > a { color: #fff !important }
#contact_us .navDisplay #gnb > ul > li:hover ul li a { color: #ccc; }
#contact_us .navDisplay #gnb > ul > li ul li a:active { color: #666; }
#contact_us .navDisplay #gnb > ul > li:hover ul li a:hover { color: #fff }
#contact_us .navDisplay #gnb.active ul li a { color: #ccc }
#contact_us .navDisplay #gnb.active > ul > li > a:after { background-color: #fff; }
#contact_us .navDisplay #gnb ul li.active a { color: #ccc }
#contact_us .navDisplay #gnb ul li ul li a { color: #ccc; }
#contact_us .navDisplay #gnb ul li ul li a em { background: rgba(255, 255, 255, 0); }
#contact_us .navDisplay #gnb ul li ul li a em::after { background: rgba(255, 255, 255, 0); }
#contact_us .navDisplay #gnb ul li ul li a:hover em::after { background: rgba(255, 255, 255, .7); }
#contact_us .navDisplay #gnb ul li ul li.active a { color: #666; }
#contact_us .navDisplay #gnb ul li ul li a:hover, #about_us #gnb ul li ul li a:focus { color: #666; }
#contact_us .navDisplay #head.active #logo a.logo { background: url(../images/common/logo2.svg) left top no-repeat; background-size: 100% auto; }
body.active #header { border-bottom: 1px solid rgba(0, 0, 0, .1); }
#header.navDisplay #head { height: 80px }
#header.navDisplay #gnb > ul li a.dep01 { padding: 0 12px 32px; }
#header.navDisplay #logo { top: 28px }
body.active .fnb .langArea { top: 29px }
body.active .header_toggle { top: 28px }
#header.navDisplay #gnb ul li ul { top: 90px }
body.active.gnb_over .gnb_menu { top: -40px }
body.active.gnb_over #gnb > ul li > ul li { padding: 2px 0; }
body.active #gnb > ul li { padding: 28px 16px 0px; }
/*#header.navDisplay #gnb { width: 930px }*/
/********************************************* eng *************************************************/
body.eng #gnb > ul li { font-size: 18px; padding: 28px 16px 26px; }
body.eng #gnb > ul li a.dep01 { padding: 16px 12px 46px }
body.eng #gnb > ul li > ul li { padding: 8px 0; font-size: 15px; transition: .2s ease-in-out; }
body.eng .navDisplay #gnb > ul li > ul li { padding: 4px 0; font-size: 15px; }
body.eng #masthead .cont-frame .cont-area .contact-infor dl { font-size: 17px }
body.eng #masthead .footer .ft_area .ft { padding: 30px 0 0 0; font-size: 14px }
body.eng #site-nav .col { font-size: 16px; padding: 4vh 0; display: flex; }
body.eng #section6 .footer .ft_area .ft_menu dl dd a { font-size: 18px }
body.eng .helpDesk ul li a span { font-size: 12px; line-height: 130%; }
body.eng #subArea-wrap.business .service_platform > div ul li > div > span { font-size: 18px }
body.eng #subArea-wrap.business .project ul li section div.title > p span { font-size: 34px; left: 6% }
body.eng #subArea-wrap .subArea .tab-menu li a { display: flex; padding: 0px 4vw 0; position: relative; height: 100px; }
body.eng #subArea-wrap .subArea .tab-menu li a em { display: flex; position: relative; height: 100%; flex-direction: column; align-items: center; justify-content: center; padding-bottom: 0px; font-size: 18px; }
body.eng #subArea-wrap.business .business_area div.cont > p { text-align: left; }
body.eng #subArea-wrap.product .contents ul.cate { gap: 14px }
body.eng #subArea-wrap.product .product_list ul li section .txt span { text-align: left; word-break: keep-all }
body.eng #subArea-wrap.product .product_list ul li section .txt p { font-size: 34px }
/********************************************* jap *************************************************/
body.jap #gnb { width: 1200px }
body.jap #gnb > ul li { font-size: 18px; padding: 28px 20px 26px }
body.jap #gnb > ul li a.dep01 { padding: 16px 12px 46px }
body.jap #gnb > ul li > ul li { padding: 8px 0; font-size: 15px; transition: .2s ease-in-out; }
body.jap .navDisplay #gnb > ul li > ul li { padding: 4px 0; font-size: 15px; }
body.jap #masthead .cont-frame .cont-area .contact-infor dl { font-size: 17px }
body.jap #masthead .footer .ft_area .ft { padding: 30px 0 0 0; font-size: 14px }
body.jap #site-nav .col { font-size: 16px; padding: 4vh 0; display: flex; }
body.jap #section6 .footer .ft_area .ft_menu dl dd a { font-size: 18px }
body.jap .helpDesk ul li a span { font-size: 12px; line-height: 130%; }
body.jap #subArea-wrap.business .service_platform > div ul li > div > span { font-size: 18px }
body.jap #subArea-wrap.business .project ul li section div.title > p span { font-size: 34px; left: 6% }
body.jap #subArea-wrap .subArea .tab-menu li a { display: flex; padding: 0px 4vw 0; position: relative; height: 100px; }
body.jap #subArea-wrap .subArea .tab-menu li a em { display: flex; position: relative; height: 100%; flex-direction: column; align-items: center; justify-content: center; padding-bottom: 0px; font-size: 18px; }
body.jap #subArea-wrap.business .business_area div.cont > p { text-align: left; }
body.jap #section0 .about .subtitle { font-size: 26px }
body.jap #subArea-wrap.product .contents ul.cate li { word-break: break-all; }
/********************************************* 1600px *************************************************/
@media screen and (max-width: 1600px) {
/***** main ****/
#head { position: relative; width: 100%; }
#logo { left: 90px; }
.fnb > div { width: 100%; margin: 0 auto; }
.fnb { left: -90px; }
#masthead div.header > div { width: 100%; padding-left: 100px; }
#masthead .cont-frame .cont-area { width: 100%; }
#masthead .footer .ft_area { width: 100%; padding-left: 100px; }
#masthead .cont-frame { padding-left: 100px; }
.section-head { width: 100%; padding: 46px 0 0 90px; }
#section2 .txt-conts dl { width: 100%; }
#section1 .txt-conts dl { width: 100%; }
#section1 .txt-conts a.more { right: 6%; }
#section1 .swiper-slide { width: 90%; }
#section3 .txt-conts dl { width: 100%; }
#section3 .rnd-frame a.more { right: 6%; }
#section3 .rnd-area { width: 100%; }
#section3 .rnd-area ul.rnd_list { padding: 0 90px }
#section5 .txt-conts dl { width: 100%; padding-left: 90px; }
#section5 .contact-area { width: 100%; }
#section5 .contact-frame { padding-left: 90px; }
#section6 .footer .footer_notice dl { width: 100%; padding-left: 90px; padding-right: 90px }
#section6 .footer .ft_area { width: 100%; padding-left: 90px; padding-right: 90px }
#section6 .footer .copyright p { width: 100%; padding-left: 90px; padding-right: 90px }
#section7 .newPost-area { width: 100%; padding: 0 5% }
#section8 .txt-conts dl { width: 100%; }
#section8 .txt-conts dl dt { margin-top: 40px; font-size: 2vw }
#section8 .rnd-frame a.more { right: 6%; }
#section8 .rnd-area { width: 100%; }
#section8 .rnd-area ul.rnd_list { padding: 0 90px }
#section9 .bi-frame { width: 100%; }
#section9 .bi-frame .bi-area { width: 100%; padding: 90px; }
/***** sub ****/
#footer .footer_notice dl { width: 100%; padding-left: 90px; padding-right: 90px }
#footer .ft_area { width: 100%; padding-left: 90px; padding-right: 90px }
#footer .copyright p { width: 100%; padding-left: 90px; padding-right: 90px }
#subArea-wrap .spotArea .spot { width: 100%; }
#subArea-wrap .spotArea .spot .txt { width: 100%; margin: 0 auto 14px; padding: 0 90px; }
#subArea-wrap .subArea { width: 100%; margin: 0 auto; }
#subArea-wrap .subArea .tab-menu { width: 100% }
#subArea-wrap.about_us .subArea .contents .prg > div > ol li a > div.img > p { width: 100%; height: 240px; }
#subArea-wrap.about_us .subArea .contents .prg > div > ol li a > div.cont > p.title { width: 98%; }
#subArea-wrap.portfolio .subArea .port-menu { width: 100%; padding: 0 40px }
#subArea-wrap.portfolio .subArea .port-menu dl { font-size: 20px; }
/**********/
body.eng #subArea-wrap.about_us .subArea .contents .prg.location > div > ul li { font-size: 18px; }
body.jap #subArea-wrap.about_us .subArea .contents .prg.location > div > ul li { font-size: 18px; }
/* 하드웨어 컨텐츠 */
.hwCon-area { grid-template-columns: auto; }
.hwCon-area .hw-con { border-radius: 16px; width: 100%; }
.hwCon-area .hw-con:nth-child(3) { grid-template-columns: 1fr; }
.cate_wrap { flex-wrap: wrap; }
#subArea-wrap.product .contents ul.cate:nth-child(1), #subArea-wrap.product .contents ul.cate:nth-child(2) { width: 49.5%; }
#subArea-wrap.product .contents ul.cate:nth-child(3) { width: 100%; margin-top: 16px; }
}
/********************************************* 1440px *************************************************/
@media screen and (max-width: 1440px) {
#subArea-wrap.about_us .vision div.pic { flex-basis: 34% }
#subArea-wrap.about_us .vision div.pic > img { object-fit: contain }
#subArea-wrap.about_us .vision div.cont { flex-basis: 66% }
#subArea-wrap.portfolio .subArea .port-menu dd a { font-size: 20px; padding: 28px 2% }
#subArea-wrap.portfolio .subArea .port-menu dt a { width: auto }
#section3 .rnd-frame a.more { transform: scale(.7); }
#section0 .txt-conts dl.back dt h1 { font-size: 70px; }
#section0 .txt-conts dl.back dd p { font-size: 20px; }
#gnb { width: 870px }
#gnb > ul li { padding: 30px 3px 26px }
#section7 .newPost-area .post { margin: 100px 0 60px }
#section2 .txt-conts dl dt { margin-top: 40px }
#section3 .txt-conts dl dt { margin-top: 40px }
#section5 .contact-area .video-area { height: 60vh }
body.eng #gnb > ul li { padding: 30px 2px 26px }
body.jap #gnb > ul li { padding: 30px 2px 26px }
.cate_wrap { flex-wrap: wrap; }
#subArea-wrap.product .contents ul.cate:nth-child(1), #subArea-wrap.product .contents ul.cate:nth-child(2) { width: 49.4%; }
}
/********************************************* 1366px *************************************************/
@media screen and (max-width: 1366px) {
#gnb { width: 890px }
#gnb > ul li a.dep01 { padding: 16px 18px 46px; }
body.eng #gnb > ul li a.dep01 { padding: 16px 4px 46px; }
body.jap #gnb > ul li a.dep01 { padding: 16px 4px 46px; }
body.eng #gnb > ul li > ul li { font-size: 13px }
body.jap #gnb > ul li > ul li { font-size: 13px }
}
@media screen and (min-width: 1440px) {
/* 하드웨어 컨텐츠 */
.hwCon-area { grid-template-columns: repeat(3, auto); }
.hwCon-area .con ul { grid-template-columns: repeat(3, 375px); }
}
/********************************************* 1280px *************************************************/
@media screen and (max-width: 1280px) {
.work-o #subArea-wrap.product .contents .head { display: none }
#gnb { width: 700px }
#gnb > ul li { padding: 18px 2px 26px; font-size: 17px; }
#gnb > ul li a.dep01 { padding: 26px 12px 46px; }
#header.navDisplay #gnb > ul li { padding: 14px 2px 26px; }
#header.navDisplay #gnb > ul li a.dep01 { padding: 16px 12px 32px }
#gnb > ul li > ul li { font-size: 14px }
#subArea-wrap.about_us .spotArea { height: 600px }
#subArea-wrap.portfolio .subArea .port-menu dl { font-size: 18px; }
#subArea-wrap.portfolio .subArea .port-menu dd a { font-size: 18px; padding: 28px 2%; }
#subArea-wrap.portfolio .subArea .port-menu dd a em i { display: none }
#subArea-wrap.portfolio .subArea .port-menu dd .input_search { width: 250px; margin-left: 20px; }
#subArea-wrap.portfolio .subArea .port-menu { height: 100px; }
#subArea-wrap .subArea .tab-menu ul { font-size: 20px }
#subArea-wrap .subArea .tab-menu li a { padding: 40px 2vw 0 }
#subArea-wrap.business .project ul li section { width: 86%; }
#subArea-wrap.business .project ul li p.pic { position: static; width: 100%; height: 40vh; }
.pop-layer .pop_box.portArea.guest .port_list_top .swiper-slide div.txt { font-size: 24px; }
#subArea-wrap.business .project ul li section div.txt { padding: 80px }
#section7 .newPost-area .post { margin: 70px 0 40px; }
#section7 .newPost-area .post li > a.cont { font-size: 22px; height: 60px }
#section7 .newPost-area > .title > span { font-size: 50px; margin-top: 60px }
#section7 .newPost-area > .title > em { font-size: 20px; }
.confirm-area .btn { padding: 22px 58px; font-size: 20px }
/**********************/
.user-guide #subArea-wrap .subArea .title_area { display: block }
.user-guide #subArea-wrap .subArea .title_area p { display: block; margin-bottom: 20px }
.user-guide #subArea-wrap .subArea .title_area p > span { display: block; padding: 4px 20px 20px 0; }
/*************************/
#footer .ft_area .ft_menu dl dd a { font-size: 17px; }
#footer .ft_area .ft_menu dl dd { margin-right: 10px; padding-right: 10px; }
#footer .ft_area .ft_sns ul li a.sns { width: 40px; height: 40px; }
#section7 .confirm-area .btn.gray { margin-bottom: 60px; }
#section0 .txt-conts dl dt h1 { font-family: 'poppins-Bold'; }
#section0 .about .title { font-size: 6vw }
#section0 .about .subtitle { font-size: 2.5vw }
/**************************/
#section5 .contact-frame { padding: 0 10% }
#section5 .contact-area .video-area { display: none }
#section5 .contact-frame { position: static; }
#section5 .contact_list { right: 0; top: 10%; display: block; overflow: auto; min-height: auto; height: auto }
#section5 .contact_list li a { width: 100% }
#section5 .contact_list li::after { padding-right: 0; width: 100%; left: 0 }
#section5 .contact_list { width: 100% }
#section5 .contact-frame { padding: 0 10% }
#section5 .txt-conts dl { padding-left: 10%; }
#section5 .txt-conts dl dt { font-size: 3vw; }
#section5 .contact_list li a::after { display: none }
#section5 .contact_list li { position: relative; padding: 0 }
#section5 .contact_list li a span { font-size: 3vw; }
#section5 .contact_list li a p { font-size: 3vw; }
#section5 .txt-conts { position: static; margin: 50px 0 30px }
#section5 .contact_list { position: static; margin-bottom: 80px; }
#site-nav .col { font-size: 18px; padding: 3vh 0; }
#masthead .footer .ft_area .ft { padding: 20px 0 0 0 }
#masthead .cont-frame .cont-area .contact-infor dl dt { display: none }
#masthead .cont-frame .cont-area .contact-infor dl dd { padding: 1vh 0 }
#subArea-wrap.about_us .partners div.banner_list ul li { float: left; width: 23% }
#subArea-wrap.about_us .partners div.banner_list ul li img { width: 100% }
/**********/
#masthead .cont-frame .cont-area .contact-infor dl { font-size: 14px }
/**********/
#section8 .newSolution_list { height: 100%; }
#section8 .txt-conts dl dt { font-size: 2.5vw }
body.eng #gnb > ul li a.dep01 { padding: 26px 4px 46px; font-size: 14px; }
body.eng #header.navDisplay #gnb > ul li { padding: 4px 2px; }
body.eng #header.navDisplay #gnb > ul li a.dep01 { padding: 16px 4px 32px }
body.eng #gnb > ul li > ul li { font-size: 11px; line-height: 120% }
body.eng #site-nav .col { font-size: 14px; padding: 3vh 0; }
body.jap #gnb > ul li a.dep01 { padding: 26px 4px 46px; font-size: 14px; }
body.jap #header.navDisplay #gnb > ul li { padding: 4px 2px; }
body.jap #header.navDisplay #gnb > ul li a.dep01 { padding: 16px 4px 32px }
body.jap #gnb > ul li > ul li { font-size: 11px; line-height: 120% }
body.jap #site-nav .col { font-size: 14px; padding: 3vh 0; }
.hwCon-area .con ul { grid-template-columns: repeat(3, 375px); }
.qcMenu-container { flex-direction: column; gap: 24px; }
.qcMenu::before { height: 400px; }
#subArea-wrap.identity-page .bicontainer .brand-concept .biname { width: 50%; }
#subArea-wrap.identity-page .bicontainer .brand-concept figure { width: 46%; }
#subArea-wrap.identity-page .cicontainer .ci-colors > ul.imgbox li p span { display: block; }
#subArea-wrap.identity-page .cicontainer .ci-colors > ul.imgbox li p { font-size: 18px }
#subArea-wrap.identity-page .bicontainer .brand-concept .biname a.btn { min-width: 100%; font-size: 18px; height: 72px; }
/******************************************/
.work-o .new_product_list > ul > li > section > ul > li { width: calc((100% - 40px) / 2); }
}
/********************************************* 1024px *************************************************/
@media screen and (max-width: 1024px) {
#site-nav li a { padding: 20px 10px; }
#site-nav .col { display: block; }
#site-nav .col > a { display: block; }
#site-nav .col > ul { display: block; }
/* product_05 */
.hwCon-area .con_wrap { flex-direction: column; }
.hwCon-area .con ul li a { min-height: 46px; height: auto; line-height: 1.2; }
.hwCon-area .con ul { grid-template-columns: repeat(2, 375px); }
/**********/
#gnb { opacity: 0; display: none }
#section0 .item video { max-height: 100%; }
#section0 .item img { max-height: 100%; }
.mobile #section0 .txt-conts dl.back dt h1 { font-size: 60px; }
.mobile #section0 .txt-conts dl.back dd p { font-size: 20px; }
/**********/
#logo { left: 10%; top: 22px !important; }
/*.fnb .langArea { display: none }*/
.fnb .langArea { top: 26px !important; ; right: 40px; width: 46px; }
.fnb .langArea > a { text-indent: -9999px; display: inline-block }
.fnb { left: -10%; }
.header_toggle { right: 0; top: 23px !important; }
#result .header_toggle span { background: #333 }
#head { height: 70px !important }
.arrow-area { display: none }
.pagination_container { display: none }
#fp-nav { display: none }
#logo a.logo { background: url(../images/common/logo.svg) left top no-repeat; background-size: 100% auto; }
#fullpage #logo a.logo { background: url(../images/common/logo2.svg) left top no-repeat !important; background-size: 100% auto !important; }
#portfolio .header_toggle span { background: #333; }
#portfolio .header_toggle.is-active span { background: #fff; }
#contact_us .header_toggle span { background: #333; }
#contact_us .header_toggle.is-active span { background: #fff; }
#header { border-bottom: 1px solid rgba(0, 0, 0, .1); }
#section2.active .txt-conts dl dt { font-size: 4vw; bottom: 0; }
#section2.active .txt-conts dl dd { font-size: 3vw; bottom: 0; }
#section2 .txt-conts dl dd em.num { min-width: auto }
#section3 .rnd-area ul.rnd_list { padding: 0 0px }
#section3 .rnd-area ul.rnd_list { flex-wrap: wrap }
#section3 .rnd-area ul.rnd_list li { flex-basis: 50%; height: 26vh; margin-left: 0; }
#section3 .rnd-area ul.rnd_list li.active { flex-basis: 50%; padding: 0; }
#section3 .rnd-area ul.rnd_list li.active > div p { padding: 0; text-align: center; }
#section3 .rnd-area ul.rnd_list li.active > div span { opacity: 0 }
#section3 .rnd-area ul.rnd_list li:first-child { margin-left: 0px; }
#section4 .item .inner h1 { font-size: 6vw }
#section4 .item .inner p { font-size: 5vw; }
#section4 .item .inner span { font-size: 3vw; }
#section8 .txt-conts dl dt { font-size: 3vw }
/**********/
#subArea-wrap .subArea .tab-menu ul { font-size: 16px; justify-content: flex-start; }
#product #subArea-wrap .subArea .tab-menu li a { padding: 18px 0 0; font-size: 16px; }
#subArea-wrap .subArea .tab-menu li a { padding: 40px 1vw 0 }
/**********/
.tHeader { display: none }
.tBody { border-top: 1px solid #bcbcbc; }
.td i { display: inline-block !important }
.tBody .tRow { padding: 0 16px; float: left; width: 100%; }
.tBody .nm { display: none }
.tBody .title { float: left; width: 100% !important; font-size: 22px; padding: 12px 0 4px 0px; }
.tBody .name { float: left; width: auto; font-size: 13px; color: #999; padding: 4px 0 10px 0px; }
.tBody .name::after { content: "|"; color: #ddd; font-size: 10px; margin: 0 8px; position: relative; top: -2px }
.tBody .date { float: left; width: auto; font-size: 13px; color: #999; padding: 5px 0 10px 0px; }
.tBody .date::after { content: ""; color: #ddd; font-size: 10px; margin: 0 8px; position: relative; top: -2px }
.tBody .file { float: right; width: auto; font-size: 15px; color: #999; padding: 4px 0 10px 0px }
.tBody .group { float: left; width: auto; font-size: 13px; color: #999; padding: 4px 0 10px 0px }
.tBody .group::after { content: "|"; color: #ddd; font-size: 10px; margin: 0 8px; position: relative; top: -2px }
.tBody .count { float: left; width: auto; font-size: 13px; color: #999; padding: 5px 0 10px 0px; }
.tBody .count::after { content: "|"; color: #ddd; font-size: 10px; margin: 0 8px; position: relative; top: -2px }
.tBody .pic { margin-bottom: 14px; }
.readBody > .contents table { width: 100% !important }
.readBody > .contents table td { width: auto !important }
.readBody > .contents img { width: 100% !important; height: auto !important; max-width: 100% !important }
/**********/
#masthead.is-active { height: 100vh; overflow: auto; }
#masthead .footer { float: left; border-top: 1px solid rgba(255, 255, 255, .1) }
#masthead .cont-frame .cont-area .contact-infor { display: none }
#masthead .cont-frame { border: none }
#masthead .footer .ft_area { }
#masthead .footer .ft_sns { display: none }
#masthead div.header { display: none }
#masthead .cont-frame .cont-area { display: block }
#masthead .cont-frame { padding-left: 16vw; margin: 7vh 0; height: auto; float: left }
#masthead .cont-frame .cont-area .container { width: 100% }
#masthead .cont-frame .cont-area .container { display: block }
#masthead.is-active .col > a { padding-bottom: 20px; width: 100%; }
#masthead #site-nav .col > a { font-size: 28px }
#masthead #site-nav .col > ul li { padding: 10px 0 }
#masthead #site-nav .col > ul li > a { font-size: 20px; padding: 2px 0px; width: 100%; display: inline-block }
#masthead #site-nav .col > ul li { float: left; margin-right: 30px; width: 100%; }
#masthead #site-nav .col > ul li { padding: 8px 0 }
#masthead #site-nav .col { padding: 2vh 0 4vh; float: left; width: 100% !important; }
#masthead #site-nav.is-active { display: block; }
#masthead .footer .ft_area { padding-left: 0px; }
#masthead .footer .ft_area .ft ul li { width: 100%; padding: 14px 0; }
#masthead .footer .ft_area .ft ul li a { font-size: 20px; }
#masthead .footer .ft_area .ft ul { padding-left: 16vw; margin-bottom: 150px }
/*****************/
#sub_wrapper { background: #fff }
#subArea-wrap { background: #fff; }
#subArea-wrap .subArea { box-shadow: none }
#subArea-wrap .subArea .contents { }
#subArea-wrap .subArea .contents-area { width: 100%; padding: 4vh 0; }
#subArea-wrap .spotArea { display: none !important }
#subArea-wrap .subArea { top: 70px; }
#subArea-wrap .subArea .tab-menu { height: 56px; overflow: hidden; overflow-x: auto }
#subArea-wrap .subArea .tab-menu { top: 70px !important; background: rgba(255, 255, 255, .9); height: auto !important; padding-left: 20px }
#subArea-wrap .subArea .tab-menu li { flex: 1; text-align: center }
#subArea-wrap .subArea .tab-menu li a { padding: 18px 2vw 0 !important; font-size: 16px !important; }
#subArea-wrap .subArea .tab-menu li a em { padding-bottom: 18px !important; white-space: nowrap; }
/*	#header { background: #fff }*/
#subArea-wrap .subArea .contents .prg h2.logo { display: none }
#subArea-wrap .subArea .contents .prg { display: block }
#subArea-wrap .subArea .contents .prg h3 { width: 100%; margin-bottom: 10px }
#subArea-wrap .subArea .contents .prg h3 > br { display: none }
#subArea-wrap.contact_us .subArea .contents .prg > div { width: 100% }
#subArea-wrap.about_us .subArea .contents .prg.location > div > ul li { display: block }
#subArea-wrap.about_us .subArea .contents .prg > div { width: 100% }
#subArea-wrap.about_us .subArea .contents .prg > div > ol li a > div.img { display: block; padding-right: 0px; width: 100%; max-width: 100%; margin: 30px 0; }
#subArea-wrap.about_us .subArea .contents .prg > div > ol li a { flex-direction: column; }
#subArea-wrap.about_us .subArea .contents .prg > div > ol li a > div.cont { width: 100%; padding-bottom: 40px }
#subArea-wrap.about_us .subArea .contents .prg.location > div > ul li > span { display: block; margin-bottom: 10px }
/********************/
#section6 .footer .footer_notice dl dd.nav_btn { display: none }
#section6 .footer .footer_notice dl { padding: 20px }
#section6 .footer .footer_notice dl dt { font-size: 15px; flex-basis: 70px; }
#section6 .footer .ft_area { display: none }
#section6 .footer .copyright p { padding: 20px; font-size: 14px; }
#footer .footer_notice dl dd.nav_btn { display: none }
#footer .footer_notice dl { padding: 20px }
#footer .footer_notice dl dt { font-size: 15px; flex-basis: 70px; }
#footer .ft_area { display: none }
#footer .copyright p { padding: 20px; font-size: 14px; }
/************/
.cd-top.cd-is-visible { display: none !important }
#subArea-wrap.business .cloud_platform_area div.pic { display: none }
#subArea-wrap div.cont > p { word-break: break-all }
#subArea-wrap div p.txt { word-break: break-all }
#subArea-wrap.about_us .contents > div { display: block; margin-bottom: 50px; }
#subArea-wrap.about_us .contents > div.history { height: 100vh; }
#subArea-wrap.about_us .contents .values { margin-bottom: 100px; }
#subArea-wrap.about_us div.pic { display: none !important }
#subArea-wrap.about_us .mission::after { display: none }
#subArea-wrap.about_us .mission div.cont h3 em::after { display: none }
#subArea-wrap.about_us div.cont { padding-left: 0 !important; }
#subArea-wrap.about_us div.cont h2 { text-align: left !important; padding: 0 0 30px 0 !important; font-size: 4vw !important; }
#subArea-wrap.about_us div.cont h3 em { font-size: 6vw !important; }
#subArea-wrap.about_us div.cont h3 { text-align: left !important }
#subArea-wrap.about_us div.cont h3 span { font-size: 4vw !important; margin-top: 10px !important; }
#subArea-wrap.about_us div.cont { padding-right: 0 !important; padding-left: 0 !important; width: 100% }
#subArea-wrap.about_us div.cont > p { font-size: 2.5vw !important; margin-top: 50px; margin-top: 30px !important; margin-bottom: 100px !important; text-align: left !important; }
#subArea-wrap.about_us .subArea .contents .prg > div > ol li a > div.cont > p.txt { height: auto; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }
#subArea-wrap.about_us .subArea .contents .prg > div > ol li a > div.cont > p:first-child { margin: 0 !important }
#subArea-wrap.about_us .subArea .contents .prg > div > ol li a > div.cont > p.title { margin: 0 !important }
#subArea-wrap.about_us .subArea .contents .prg > div > ol li a > div.cont > p.txt { margin: 0 !important }
#subArea-wrap.about_us .vision::after { display: none }
#subArea-wrap.about_us .values div.head { display: block; }
#subArea-wrap.about_us div.head h2 { font-size: 4vw !important; padding: 0 0 30px 0 !important; position: static }
#subArea-wrap.about_us .contents div.head h3 { border: none }
#subArea-wrap.about_us .contents div.head h3 em { padding: 0px 0 10px 0; font-size: 6vw !important; }
#subArea-wrap.about_us .contents div.head h3 span { font-size: 5vw !important; margin-top: 0px !important; }
#subArea-wrap.about_us .values div.cont { display: none }
#subArea-wrap.about_us .values::after { display: none }
#subArea-wrap.about_us .partners div.head { display: block; }
#subArea-wrap.about_us .partners div.banner_list { margin-top: 50px; }
#subArea-wrap.about_us .partners div.banner_list ul { display: inline-block; }
#subArea-wrap.about_us .partners div.banner_list ul li { float: left; width: 23.3%; margin: 6px 6px; }
#subArea-wrap.about_us .history .history_year a { font-size: 26px; float: left; margin-right: 24px }
#subArea-wrap.about_us .history .history_year a:last-child { margin: 0 }
#subArea-wrap.about_us .history .history_year #old_year { font-size: 26px; }
#subArea-wrap.about_us .history .history_year a.on { font-size: 26px; }
#subArea-wrap.about_us .history .history_list dl dt { float: left; width: 100%; margin: 20px 0; }
#subArea-wrap.about_us .history .history_list dl dd { float: left; margin: 4px 0; width: 100%; font-size: 18px; }
#subArea-wrap.about_us .history .history_list dl { margin-bottom: 40px; padding-bottom: 40px; }
#subArea-wrap.about_us .history .history_list dl:last-child { margin-bottom: 80px; padding-bottom: 80px; }
#subArea-wrap.about_us .awards .awards_year a { font-size: 26px; float: left; margin-right: 24px }
#subArea-wrap.about_us .awards .awards_year a:last-child { margin: 0 }
#subArea-wrap.about_us .awards .awards_year #old_year { font-size: 26px; }
#subArea-wrap.about_us .awards .awards_year a.on { font-size: 26px; }
#subArea-wrap.about_us .awards .awards_list dl dt { float: left; width: 100%; margin: 20px 0; }
#subArea-wrap.about_us .awards .awards_list dl dd { float: left; margin: 4px 0; width: 100%; font-size: 18px; }
#subArea-wrap.about_us .awards .awards_list dl { margin-bottom: 40px; padding-bottom: 40px; }
#subArea-wrap.about_us .awards .awards_list dl:last-child { margin-bottom: 80px; padding-bottom: 80px; }
#subArea-wrap.about_us .partners div.banner_wrap div.h2 { display: none }
#subArea-wrap.about_us .partners div.banner_list ul li img { width: 100%; }
/******************/
#subArea-wrap.business .business_area div.cont { display: block; }
#subArea-wrap.business .business_area div.cont > div { width: 100%; padding-right: 0; }
#subArea-wrap.business .business_area div.cont > div h2 { font-size: 24px; padding: 0 0 30px 0; }
#subArea-wrap.business .business_area div.cont > div h3 em > br { display: none }
#subArea-wrap.business .business_area div.cont > div h3 em { font-size: 40px; }
#subArea-wrap.business .business_area div.cont > p { margin-top: 50px; font-size: 20px; text-align: left }
#subArea-wrap.business .business_area div.pic { display: none }
#subArea-wrap.business .business_area { display: block; margin-bottom: 100px; }
/* 0602 */
#subArea-wrap.business .service_group { display: block; margin-bottom: 80px }
#subArea-wrap.business .service_group > div { border-top: none }
#subArea-wrap.business .service_group h2 { padding: 0 }
#subArea-wrap.business .service_group > div p.txt { margin: 20px 0 40px; font-size: 20px; }
#subArea-wrap.business .service_group > div ul { display: block }
#subArea-wrap.business .service_group > div ul li { margin: 0 0 30px 0 }
#subArea-wrap.business .service_group > div ul li > p { font-size: 20px }
#subArea-wrap.business .service_group > div ul li > span { font-size: 18px }
/* 0602 */
#subArea-wrap.business .service_platform { display: block; margin-bottom: 80px }
#subArea-wrap.business .service_platform > div { border-top: none }
#subArea-wrap.business .service_platform h2 { padding: 0 }
#subArea-wrap.business .service_platform > div p.txt { margin: 20px 0 40px; font-size: 20px; }
#subArea-wrap.business .service_platform > div ul { display: block }
#subArea-wrap.business .service_platform > div ul li { margin: 0 0 30px 0 }
#subArea-wrap.business .service_platform > div ul li > p { font-size: 20px }
#subArea-wrap.business .service_platform > div ul li > span { font-size: 18px }
/* 0602 */
#subArea-wrap.business .cloud_platform { display: block; margin-bottom: 80px }
#subArea-wrap.business .cloud_platform > div { border-top: none }
#subArea-wrap.business .cloud_platform h2 { padding: 0 }
#subArea-wrap.business .cloud_platform > div p.txt { margin: 20px 0 40px; font-size: 20px; }
#subArea-wrap.business .cloud_platform > div ul { display: block }
#subArea-wrap.business .cloud_platform > div ul li { margin: 0 0 30px 0 }
#subArea-wrap.business .cloud_platform > div ul li > p { font-size: 20px }
#subArea-wrap.business .cloud_platform > div ul li > span { font-size: 18px }
/* 0602 */
#subArea-wrap.business .service_component { display: block; margin-bottom: 80px }
#subArea-wrap.business .service_component > div { border-top: none }
#subArea-wrap.business .service_component h2 { padding: 0 }
#subArea-wrap.business .service_component > div p.txt { margin: 20px 0 40px; font-size: 20px; }
#subArea-wrap.business .service_component > div ul { display: block }
#subArea-wrap.business .service_component > div ul li { margin: 0 0 30px 0 }
#subArea-wrap.business .service_component > div ul li > p { font-size: 20px }
#subArea-wrap.business .service_component > div ul li > span { font-size: 18px }
/* 0602 */
#subArea-wrap.business .service_point { margin-bottom: 100px; display: block; }
#subArea-wrap.business .service_point h2 { font-size: 32px; padding: 0 0 0px 0 }
#subArea-wrap.business .service_point > div { border: none }
#subArea-wrap.business .service_point > div ol { margin-top: 30px; }
#subArea-wrap.business .service_point > div ol li { font-size: 20px; margin-bottom: 50px; }
#subArea-wrap.business .process div.head { display: block; }
#subArea-wrap.business .process div.head h2 { font-size: 32px; padding: 0 0 30px 0; position: static; }
#subArea-wrap.business .process div.cont ul li:nth-child(even) { margin-top: 60px; }
#subArea-wrap.business .benefit div.head { display: block; }
#subArea-wrap.business .benefit div.head h2 { font-size: 32px; padding: 0 0 30px 0; position: static; }
#subArea-wrap.business .benefit div.cont .pic { display: none }
#subArea-wrap.business .benefit div.cont ol { display: block; margin: 30px 0 100px; }
#subArea-wrap.business .product_list { margin-bottom: 100px; display: block; }
#subArea-wrap.business .product_list div.head h3 { font-size: 20px; padding: 30px 0; width: 100%; }
#subArea-wrap.business .product_list > section { border-top: none }
#subArea-wrap.business .product_list > section ul { margin-top: 20px; margin-left: 0px; display: block; }
#subArea-wrap.business .product_list > section ul li { font-size: 3.5vw; padding: 10px 0; margin-bottom: 30px; line-height: 160%; width: 100%; margin-left: 0%; border-bottom: 2px solid #333; }
#subArea-wrap.business .product_list > section > p.comment { margin-left: 0; }
/*******************/
#subArea-wrap.business .project ul li:nth-child(n) p.pic { display: block }
#subArea-wrap.business .project ul li p.pic { position: static; width: 100%; height: 22vh }
#subArea-wrap.business .project ul li:nth-child(2) section div.title > p span { left: 10% }
#subArea-wrap.business .project ul li section { position: static; width: 100%; }
#subArea-wrap.business .project ul li section div.title { position: static }
#subArea-wrap.business .project ul li section div.txt { padding: 30px 40px }
#subArea-wrap.business .project ul li section div.txt p { font-size: 20px }
#subArea-wrap.business .project ul li section div.txt span { font-size: 17px; }
#subArea-wrap.business .project ul li section div.title > p em { font-size: 100px }
#subArea-wrap.business .project ul li section div.title > p span { font-size: 30px; left: 10% }
#subArea-wrap.business .project ul li { height: auto; margin-bottom: 100px }
/******************/
#subArea-wrap .subArea .contents-area { padding: 6vh 0 }
#subArea-wrap.product .contents .head { margin-bottom: 100px; }
#subArea-wrap.product .contents .head > h2 { font-size: 5vw; padding-bottom: 10px; }
#subArea-wrap.product .contents .head > p { font-size: 3vw; }
#subArea-wrap.product .product_list ul li section { height: auto; margin-bottom: 60px; flex-wrap: wrap; flex-direction: column-reverse; }
#subArea-wrap.product .product_list ul li section p.pic { display: block; float: left; width: 100%; max-width: 100%; height: auto; margin-top: 20px }
.pd05 #subArea-wrap.product .product_list ul li section p.pic { height: auto; }
#subArea-wrap.product .product_list ul li section .txt { display: block; width: 100%; height: 100%; }
#subArea-wrap.product .product_list ul li:nth-child(even) section { flex-direction: column-reverse !important; }
#subArea-wrap.product .product_list ul li:nth-child(even) section .txt { float: left; }
#subArea-wrap.product .product_list ul li:nth-child(even) section .txt p { padding-left: 0%; }
#subArea-wrap.product .product_list ul li:nth-child(even) section .txt span { padding-left: 0%; }
#subArea-wrap.product .product_list .video-area { margin: 0 }
#subArea-wrap.portfolio .subArea .port-menu { position: static }
#subArea-wrap.portfolio .subArea .port-menu dt a::after { display: none }
#subArea-wrap.portfolio ul.port-list .card-area > dl dd span { display: block; }
#subArea-wrap.portfolio ul.port-list .card-area > dl dd span::after { display: none }
#subArea-wrap.product .product_list ul li section .txt span { padding-right: 0% }
#subArea-wrap.product .product_list ul li section .txt p > em { font-size: 20px; }
.pd05 .product_list .spec-con { flex-direction: column; }
/**********************/
#subArea-wrap.media .awards .awards_list dl dd { font-size: 18px }
/**********************/
.pop-layer .pop_box.portArea .inforArea a.close { top: 10px; }
.pop-layer .pop_box.portArea .port_list_top .swiper-slide { height: 460px }
.pop-layer .pop_box.portArea.guest .port_list_top .swiper-slide div.txt { font-size: 20px; }
.pop-layer .pop_box.portArea.guest .port_list_top .swiper-slide div.txt > span { margin-top: 20px; font-size: 17px; }
.btnListBlock.portfolio { width: 70% }
.pop-layer .pop_box.portArea .inforArea dl dt { font-size: 20px; }
.pop-layer .pop_box.portArea .inforArea { padding-top: 40px; }
.pop-layer .pop_box.portArea .inforArea dl { height: 270px; }
.pop-layer .pop_box.portArea .port_list_btm { bottom: 30px; }
/**********************/
.mobile #section2 .txt-conts { margin-top: 50px; }
.mobile #section2 .portfolio_list { margin-bottom: 120px; }
.mobile #section3 .txt-conts { margin-top: 50px; }
.mobile .section-head { font-size: 3vw; padding: 6vh 0 0 10% }
.mobile #section1 .txt-conts dl { padding: 2% 10%; }
.mobile #section1 .txt-conts dl dt { font-size: 4vw; }
.mobile #section1 .txt-conts dl dd { font-size: 2vw; }
.mobile #section1.active .txt-conts dl dd span br { display: none }
.mobile #section1 .txt-conts { bottom: auto; top: 45vh; left: 0; }
.mobile #section0 .txt-conts dl dt h1 { font-family: 'poppins-Bold'; }
.mobile #section0 .about .title { font-size: 6vw }
.mobile #section0 .about .work-o .title > img { width: 80% }
.mobile #section0 .about .subtitle { font-size: 2.5vw }
.mobile #section0 .about .work-o .subtitle { font-size: 3vw }
.mobile #section0 .about .work-o .text { font-size: 2vw }
.mobile .section { height: auto; min-height: 500px; }
.mobile #section0 { height: 80% }
.mobile .section-header { position: static; }
.mobile #section4 .section-header { position: absolute }
.mobile #section1 .txt-conts { position: static; margin-top: 30px; }
.mobile #section1 .txt-conts a.more { position: static; margin-top: 30px; -webkit-transform-origin: left top; -moz-transform-origin: left top; transform-origin: left top; -webkit-transform: scale(.7); -moz-transform: scale(.7); transform: scale(.7) }
.mobile #section1 .swiper-slide > div > img { padding-top: 0; }
.mobile #section1 .swiper-slide.swiper-slide-active > div > img { padding-top: 0px; }
.mobile #section1.active .business_list { margin-bottom: 120px }
.mobile .section-header { position: static; }
.mobile #section3 .rnd-frame { margin-bottom: 160px }
.mobile #section4 .swiper { height: 76vh !important; }
/*
.mobile #section5 .contact-area .video-area { display: none }
.mobile #section5 .contact-frame { position: static; }
.mobile #section5 .contact_list { right: 0; top: 10%; display: block; overflow: auto; min-height: auto; height: auto }
.mobile #section5 .contact_list li a { width: 100% }
.mobile #section5 .contact_list li::after { padding-right: 0; width: 100%; left: 0 }
.mobile #section5 .contact_list { width: 100% }
.mobile #section5 .contact-frame { padding: 0 10% }
.mobile #section5 .txt-conts dl { padding-left: 10%; }
.mobile #section5 .txt-conts dl dt { font-size: 4vw; }
.mobile #section5 .contact_list li a::after { display: none }
.mobile #section5 .contact_list li { position: relative; padding: 0 }
.mobile #section5 .contact_list li a span { font-size: 4vw; }
.mobile #section5 .contact_list li a p { font-size: 4vw; }
.mobile #section5 .txt-conts { position: static; margin: 50px 0 30px }
.mobile #section5 .contact_list { position: static; margin-bottom: 80px; }
*/
  /*
.mobile .fnb { display: block }
#head .fnb { display: none }
*/
.pop-layer .pop_box.productArea .body .cont ul li { flex-basis: 100%; min-height: auto; margin: 10px !important }
/**********************/
#section8 .newSolution_list { height: 100%; }
body.eng #masthead #site-nav .col > a { font-size: 22px }
body.eng #masthead #site-nav .col > ul li > a { font-size: 17px; padding: 2px 0px; width: 100%; display: inline-block }
body.eng #masthead #site-nav .col { padding: 2vh 0 4vh; float: left; width: 100% !important; display: flex; flex-direction: column; }
body.eng#product #subArea-wrap .subArea .tab-menu li a { padding: 0; height: 56px; font-size: 10px; }
body.eng #subArea-wrap .subArea .tab-menu li a em { font-size: 16px; }
body.jap #masthead #site-nav .col > a { font-size: 22px }
body.jap #masthead #site-nav .col > ul li > a { font-size: 17px; padding: 2px 0px; width: 100%; display: inline-block }
body.jap #masthead #site-nav .col { padding: 2vh 0 4vh; float: left; width: 100% !important; display: flex; flex-direction: column; }
body.jap#product #subArea-wrap .subArea .tab-menu li a { padding: 0; height: 56px; font-size: 10px; }
body.jap #subArea-wrap .subArea .tab-menu li a em { font-size: 16px; }
.holiday-area { display: none }
.hwCon-area .con ul.fr3 { grid-template-columns: repeat(2, 375px); }
/********************************************/
#subArea-wrap.identity-page .cicontainer .ci-colors > ul.imgbox { flex-direction: column; }
#subArea-wrap.identity-page .cicontainer .herocon > img { height: 200px; }
#subArea-wrap.identity-page .qcMenu .con p { font-size: 20px; }
#subArea-wrap.identity-page .cicontainer .herocon h3 { font-size: 22px; }
#subArea-wrap.identity-page .cicontainer .herocon .into { font-size: 22px; margin: 0px 0px 60px 0px; }
#subArea-wrap.identity-page .identity .qcMenu .con { height: 54px; }
#subArea-wrap.identity-page .cicontainer .ci-colors > article { flex-direction: column; margin-bottom: 40px; }
#subArea-wrap.identity-page .default_downcuwrapper > article .imgbox > img { width: 50%; }
#subArea-wrap.identity-page .default_downcuwrapper > article .imgbox { height: 200px; }
#subArea-wrap.identity-page .bicontainer .brand-concept .biname { width: 100%; }
#subArea-wrap.identity-page .bicontainer .brand-concept { flex-direction: column; }
#subArea-wrap.identity-page .bicontainer .brand-concept figure { width: 100%; height: 370px; }
#subArea-wrap.identity-page .bicontainer .logo-type > article > div { flex-direction: column; }
#subArea-wrap.identity-page .bicontainer .logo-type > article > div > h3 { width: 100%; }
#subArea-wrap.identity-page .bicontainer .logo-type > article > div > p { width: 100%; }
#subArea-wrap.identity-page .bicontainer .logo-type > article > .brand-area { flex-direction: column; gap: 80px; padding: 60px 30px; }
#subArea-wrap.identity-page .default_downcuwrapper > article .confirm-area .btn.confirm { width: 100%; font-size: 18px; }
#subArea-wrap.identity-page .default_downcuwrapper > article .confirm-area .btn.confirm > img { width: 18px; }
#subArea-wrap.identity-page .bicontainer .color-system > div { display: flex; gap: 30px; margin-bottom: 60px; flex-direction: column; }
#subArea-wrap.identity-page .bicontainer .color-system > div > h3 { width: 100%; }
#subArea-wrap.identity-page .bicontainer .color-system > div > p { width: 100%; }
/********************************************/
#section9 .bi-frame .bi-area > div.bi-logo > article > figure { width: 60%; }
#section9 .bi-frame .bi-area > div.bi-logo > article { gap: 20px; }
#section9 .bi-frame .bi-area > div.bi-logo > article > span { font-size: 22px; line-height: 120%; }
#section9 .bi-frame .bi-area { padding: 10%; display: flex; justify-content: center; margin: 0px auto 60px; }
#section9 .bi-frame .bi-area > div.bi-logo > span { display: none }
#section9 .bi-frame .bi-area > div.bi-txt { margin-top: 60px; flex-direction: column; }
#section9 .bi-frame .bi-area > div.bi-txt > p { display: flex; flex-direction: column; gap: 20px; }
#section9 .bi-frame .bi-area > div.bi-txt > p > em { color: #fff; font-size: 19px; line-height: 130%; }
#section9 .bi-frame .bi-area > div.bi-txt > p > span { color: #fff; font-size: 22px; }
#section9 .bi-frame .bi-area > div.bi-txt > a { margin-top: 60px }
#section9 .bi-frame .bi-area::after { content: ""; display: inline-block; width: 160px; height: 50px; background: url(../images/main/bi02.svg) left top / 100% no-repeat; position: absolute; right: 10px; bottom: -60px; }
/********************/
.work-o .new_product_list { padding: 0 0px; }
.work-o .new_product_list > ul { flex-direction: column; }
.work-o .new_product_list > ul > li { display: flex; flex-direction: column; margin-top: 50px; }
.work-o .new_product_list > ul > li > article { width: 100%; min-width: 100%; padding: 50px 0px 0 0px; gap: 10px; }
.work-o .new_product_list > ul > li > section { width: 100%; border-left: none; padding: 36px 0 0 0; }
.work-o .new_product_list > ul > li:first-child { margin-top: 0px; }
.work-o .new_product_list > ul > li:first-child > article { padding: 10px 0px 0 0px; }
/********************/
.addon-hot-section { margin: 0 0; border-bottom: 1px solid #e9edf3; }
.addon-hot-section h3 { padding: 26px 0px 20px; }
.addon-hot-list { padding: 8px 0px 30px; }
/********************/
}
/******************************************************** //1024 *********************************************************************/
/********************************************* 960px *************************************************/
@media screen and (max-width: 960px) {
.mobile #section0 .txt-conts dl.back dt h1 { font-size: 50px; }
.mobile #section0 .txt-conts dl.back dd p { font-size: 18px; }
.mobile #section0 .about .subtitle > a { padding: 18px 66px; font-size: 18px }
.mobile #section0 .txt-conts .title_area dl.back dd p > span::before { margin: 0px auto 10px; }
/* #masthead.is-active .col { opacity: 1; transform: none; animation-play-state: paused; } */
.mobile #section1.active .business_list { margin-bottom: 60px }
.mobile #section2 .portfolio_list { margin-bottom: 0px }
.mobile #section3 .txt-conts { margin-top: 20px }
.mobile #section3 .rnd-frame { margin-bottom: 100px; }
#section2.active .txt-conts dl dt { font-size: 4vw; bottom: -0vw; }
#section2.active .txt-conts dl dd { font-size: 3vw; bottom: -0vw; }
#section3 .txt-conts dl dt { font-size: 5vw; bottom: -4vw; }
#section8 .txt-conts dl dt { font-size: 3.5vw }
#subArea-wrap.about_us .partners div.banner_list ul li { width: 29% }
#subArea-wrap.business .process div.cont::before { display: none }
#subArea-wrap.business .process div.cont { padding-top: 0px; }
#subArea-wrap.business .process div.cont ul { margin-top: 0px; display: block; }
#subArea-wrap.business .process div.cont ul li:nth-child(even) { margin-top: 0px; }
#subArea-wrap.business .process div.cont ul li { font-size: 20px; margin: 0 0 30px 0; }
#subArea-wrap.business .process div.cont ul li:first-child { margin: 0 0 30px 0; }
#subArea-wrap.business .process div.cont ul li:last-child { margin: 0; }
#subArea-wrap.business .process { margin-bottom: 100px; }
#subArea-wrap.business .benefit div.cont ol li { font-size: 20px }
#subArea-wrap.business .benefit { margin-bottom: 80px }
/***/
#subArea-wrap.portfolio ul.port-list { width: 100%; }
#subArea-wrap.portfolio .subArea .port-menu { height: auto; float: left; display: block; padding: 0 40px 20px; }
#subArea-wrap.portfolio .subArea .port-menu { display: block; padding: 10px 40px 20px; }
#subArea-wrap.portfolio .subArea .port-menu dl { justify-content: normal; }
#subArea-wrap.portfolio .subArea .port-menu dt a { padding: 10px 0; }
#subArea-wrap.portfolio .subArea .port-menu dl:first-child dd { margin-right: 0px; }
#subArea-wrap.portfolio .subArea .port-menu dd a { font-size: 18px; padding: 14px 0; margin-right: 20px; }
#subArea-wrap.portfolio .subArea .port-menu dd:last-child a { margin: 0 }
#subArea-wrap.portfolio .subArea .port-menu dl { display: block; float: left }
#subArea-wrap.portfolio .subArea .port-menu dd { float: left; }
#subArea-wrap.portfolio .subArea .port-menu dd .input_search { width: 250px; margin-left: 0; }
#subArea-wrap.portfolio .subArea .port-menu dt { float: left; }
#subArea-wrap.portfolio .subArea .port-menu dl:last-child { display: flex }
#subArea-wrap.portfolio .subArea .port-menu dd .check_style { margin-right: 20px; }
#subArea-wrap.portfolio ul.port-list li { flex-basis: 50% }
#subArea-wrap.contact_us .subArea .contents .prg.location > div > ul li { display: block; font-size: 20px; padding: 30px 0 }
#subArea-wrap.contact_us .subArea .contents .prg.location > div > ul li > div > p span { }
#subArea-wrap.contact_us .subArea .contents .prg.location > div > ul li > div > p { padding: 10px 0; font-size: 17px }
#subArea-wrap.contact_us .subArea .contents .prg.location > div > ul li > div > p span { width: 100%; padding: 10px 0; }
#subArea-wrap.contact_us .subArea .contents .prg.location > div > ul li > div > p em { line-height: 150%; }
#subArea-wrap.contact_us .subArea .contents .prg.location > div > ul li > span { display: block; }
#subArea-wrap.contact_us .subArea .contents .prg.location > div > ul li > em { display: block; padding: 10px 0; font-size: 17px }
#footer { margin-top: 100px; }
/*#subArea-wrap .subArea .tab-menu ul { padding-left: 3%; }*/
#subArea-wrap .subArea .tab-menu li { flex: 1; text-align: center }
.rightBlock { float: none; display: flex; align-items: center; justify-content: center; }
/****************/
#section0 .txt-conts dl dt { opacity: 1 }
#section0 .txt-conts dl dd { opacity: 1 }
/****************/
.pop-layer .pop_box.portArea { display: block; }
/****************/
  /*.pop-layer .pop_box.portArea .inforArea { display: none }*/
.pop-layer .pop_box.portArea .port_list_btm { display: none }
.swiper-btn { display: none }
.btnListBlock.portfolio { width: 90%; }
.pop-layer .pop_box.portArea .port_list_top .swiper-slide { height: auto; }
.pop-layer .pop_box.portArea.guest .port_list_top .swiper-slide div.txt { font-size: 17px; }
.pop-layer .pop_box.portArea.guest .port_list_top .swiper-slide div.txt > span { margin-top: 10px; font-size: 14px; line-height: 130%; }
.btnListBlock.portfolio > p { margin-bottom: 14px; }
/****************/
.user-guide #subArea-wrap .subArea .contents-area { width: 100%; padding: 160px 0 30px; }
.btnListBlock .btn { padding: 8px 20px; font-size: 17px; }
.user-guide #subArea-wrap.notice .subArea .title_area { margin-bottom: 30px; }
/****************/
#section0 .item .video-area > p { display: block }
#section0 .item .video-area video { display: none }
/****************/
.mobile .section { height: auto; min-height: 500px; }
.mobile #section0 { height: 60% }
/****************/
.pop-layer .pop_box.productArea .body .cont ul li { min-height: auto }
/****************/
#subArea-wrap.media .awards { display: block }
#subArea-wrap.media .awards .awards_year a.on { font-size: 26px }
#subArea-wrap.media .awards .awards_year a { font-size: 26px; display: inline-block; margin-right: 20px }
#section7 .newPost-area > .title > span { font-size: 40px; margin-top: 40px; }
#section7 .newPost-area .post { margin: 60px 0 0px; }
#section7 .newPost-area .post { flex-direction: column }
#section7 .newPost-area .post li { flex-basis: 100%; width: 100%; margin: 0 0 60px 0; }
#section7 .newPost-area .post li:first-child { margin: 0 0 60px 0; }
#section7 .newPost-area .post li:last-child { margin: 0 0 60px 0; }
#section7 .newPost-area .post li > div.title > span { font-size: 16px }
#section7 .newPost-area .post li > a.cont { display: block; height: auto; width: 98%; white-space: nowrap; text-overflow: ellipsis; margin: 20px 0; font-size: 20px }
#section7 .newPost-area .post li > span.date { font-size: 16px }
.pop-layer .pop_box.portArea.guest .inforArea { display: none }
.pop-layer .pop_box.portArea.guest .port_list_top .swiper-slide { min-height: 580px; overflow: auto }
.mw .fg { position: fixed; top: auto; left: 0; bottom: 0; transform: none; width: 100%; border: 2px solid #333; background: #fff; }
/*.mw .fg .pop_box > p.img { display: none }*/
.mw .fg .pop_box > div { padding: 50px 20px 20px }
.mw .fg .pop_box > div > p.title { font-size: 25px; line-height: 120%; text-align: left }
.mw .fg .pop_box > div > p.txt { font-size: 18px; padding: 20px 0 20px; line-height: 140% }
.mw .fg .pop_box > div > p.conact { font-size: 15px }
.mw .fg .pop_box > div > p.conact > em { display: inline-block; min-width: 54px; position: relative }
.mw .fg .pop_box > div > p.conact > em::after { top: 6px; right: -10px; width: 1px; height: 10px; }
.mw .fg .pop_box .confirm-area .btn { padding: 20px 40px; width: 100%; cursor: pointer; font-size: 20px }
.mw .fg .pop_box .btn-area { padding: 16px 20px; }
.mw .fg .pop_box .btn-area > a { padding: 8px 20px; background: #666; color: #fff; text-align: center; float: right; position: relative; top: -12px }
.mw .fg .pop_box .btn-area > a:hover { background: #333; }
.mw .fg .pop_notice .popup_nttCn > div { padding: 40px 20px 30px }
.mw .fg div.popup_nttCn { width: 100%; height: calc(100vh - 150px); font-size: 16px; }
.fg .pop_notice { width: 100%; height: calc(100vh - 130px); overflow: hidden; }
/*********/
.helpDesk { display: none }
.helpDesk ul li:first-child a { pointer-events: auto; cursor: pointer; }
.helpDesk { position: fixed; left: 0px; bottom: 0; background: #fff; border-radius: 18px 18px 0 0; padding: 20px 20px 20px; box-shadow: 0 0 10px rgba(0, 0, 0, .1); z-index: 999; border: 1px solid rgba(0, 0, 0, 0); opacity: .9; width: 100% }
.helpDesk:hover { border: 1px solid rgba(0, 0, 0, .1); opacity: 1 }
.helpDesk ul { color: #4D515C; display: inline-flex; width: 100%; flex-direction: row; align-items: flex-start; justify-content: center; }
.helpDesk ul li { border-bottom: none; border-right: 1px solid #eee; padding: 0px; flex-grow: 1; }
.helpDesk ul li:first-child { padding: 0px; }
.helpDesk ul li:last-child { border-bottom: none; border-right: none; padding: 0px; }
.helpDesk ul li a { color: #4D515C; width: 100%; display: inline-flex; flex-direction: column; align-items: center; justify-content: center; }
.helpDesk ul li:nth-child(1) em { display: none }
.helpDesk ul li:nth-child(1) span { font-size: 13px; font-weight: 600 }
/*********/
body.jap #subArea-wrap .subArea .tab-menu li a { height: 55px }
.qcMenu .txt { width: 100%; }
.qcMenu .txt p { font-size: 32px; }
.qcMenu .txt em { font-size: 15px; white-space: pre-wrap; }
.qcMenu .con { height: 120px; }
.qcMenu .con img { height: 36px; }
.qcMenu .con p { font-size: 15px; }
.hwCon-area .con_wrap .toggle ul li { width: fit-content; }
.hwCon-area .con ul { grid-template-columns: 1fr; }
.hwCon-area .con ul.fr3 { grid-template-columns: 1fr; }
#subArea-wrap.product .contents ul.cate:nth-child(1), #subArea-wrap.product .contents ul.cate:nth-child(2) { width: 49%; }
#subArea-wrap.identity-page .bicontainer .brand-concept .biname h3 strong { font-size: 38px; }
#subArea-wrap.identity-page .bicontainer .brand-concept .biname p { font-size: 20px; }
#subArea-wrap.identity-page .bicontainer .brand-concept figure { height: 270px; }
#subArea-wrap.identity-page .bicontainer .brand-concept figure img { width: 170px; }
#subArea-wrap.identity-page .bicontainer .logo-type > article > .brand-area li a { min-width: 100%; font-size: 18px; height: 72px; }
#subArea-wrap.identity-page .bicontainer .logo-type > article > .brand-area li a img { width: 18px; }
#subArea-wrap.identity-page .bicontainer .color-system div.chips { display: flex; gap: 80px; margin-bottom: 60px; flex-direction: column; width: 100%; }
#subArea-wrap.identity-page .bicontainer .color-system div.chips > section:first-child { width: 100%; }
#subArea-wrap.identity-page .bicontainer .color-system div.chips > section { width: 100%; }
#subArea-wrap.identity-page .bicontainer .color-system div.chips > section > article { gap: 40px; flex-wrap: wrap; }
#subArea-wrap.identity-page .bicontainer .color-system div.chips > section > article > div.chip-item { flex-grow: inherit; min-width: 100%; }
#subArea-wrap.identity-page .cicontainer .herocon > figure { height: 220px; }
#subArea-wrap.identity-page .cicontainer .herocon > figure img { width: 170px }
}
/********************************************* //960px *************************************************/
/********************************************* 760px *************************************************/
@media screen and (max-width: 760px) {
#product #subArea-wrap .subArea .tab-menu ul { min-width: 100%; gap: 14px; }
#about_us #subArea-wrap .subArea .tab-menu ul { min-width: 370px }
body.eng #subArea-wrap .subArea .tab-menu li a { padding: 8px 2vw 0; }
body.jap #subArea-wrap .subArea .tab-menu li a { padding: 2px 2vw 0; }
#subArea-wrap.product .contents ul.cate:nth-child(1), #subArea-wrap.product .contents ul.cate:nth-child(2) { width: 100%; }
.work-o .new_product_list > ul > li > section > ul > li { width: 100% }
.mobile #section0 .about .work-o .title > img { width: 80% }
.mobile #section0 .about .work-o .subtitle { font-size: 3.2vw }
.mobile #section0 .about .work-o .text { font-size: 2.5vw }
}
/********************************************* 640px *************************************************/
@media screen and (max-width: 640px) {
.mobile #section0 .txt-conts dl.back dt h1 { font-size: 30px; }
.mobile #section0 .txt-conts dl.back dd p { font-size: 16px; }
.mobile #section0 .about .subtitle > a { padding: 12px 66px; font-size: 16px }
#logo { left: 8%; top: 25px; }
#logo a.logo { width: 120px; }
.fnb { left: -8%; }
.mobile #section0 .txt-conts dl dt h1 { font-family: 'poppins-Bold'; }
#section0 .about .title { font-size: 9vw }
#subArea-wrap.media .awards .awards_list dl dt { width: 100%; margin: 20px 0 }
#subArea-wrap.media .awards .awards_list dl dd { width: 100% }
#subArea-wrap.media .awards .awards_list dl { margin-bottom: 40px; padding-bottom: 40px }
.user-guide #subArea-wrap .subArea .title_area { padding: 0px 0 30px; margin-bottom: 30px; }
.user-guide #subArea-wrap .subArea .title_area p { font-size: 36px; margin-bottom: 0px }
.user-guide #subArea-wrap .subArea .title_area p span { padding: 0 0 10px 0; }
.user-guide #subArea-wrap .subArea .title_area ul { margin-top: 20px }
.user-guide #subArea-wrap .subArea .contents-area { padding: 130px 0 10px }
/*
#section1 .txt-conts dl dt { font-size: 8vw; }
#section1 .txt-conts dl dd { font-size: 5vw; }
*/
#section2.active .txt-conts dl dt { font-size: 6vw; bottom: -4vw; }
#section2.active .txt-conts dl dd { font-size: 5vw; bottom: -4vw; }
#section0 .txt-conts dl dt h1 { font-family: 'poppins-Bold'; }
#section0 .about .title { font-size: 9vw }
#section0 .about .subtitle { font-size: 5vw }
.section-head { font-size: 5vw; padding: 25px 0 0 10%; }
#section2 .portfolio_list { }
#section3 .txt-conts dl dt { font-size: 6vw; bottom: -4vw; }
#section3.active .txt-conts dl dt { bottom: -6vw }
#section4 .item .inner h1 { font-size: 9vw; }
#section4 .item .inner p { font-size: 5vw; }
#section4 .item .inner span { font-size: 4.5vw; }
#section8 .txt-conts dl dt { font-size: 5vw }
#section4 .swiper-container-horizontal > .swiper-pagination-bullets, #section4 .swiper-pagination-custom, #section4 .swiper-pagination-fraction { bottom: 12px; }
#subArea-wrap .subArea { top: 70px; }
#subArea-wrap .subArea .tab-menu { top: 70px; background: rgba(255, 255, 255, .9); }
/*#subArea-wrap .subArea .tab-menu { height: 56px; }*/
  /*#subArea-wrap .subArea .tab-menu li a { padding: 20px 0 0; }*/
#subArea-wrap .subArea .tab-menu li { flex: 1; white-space: nowrap; }
#subArea-wrap .subArea .tab-menu li a em { padding-bottom: 17px; }
#subArea-wrap .subArea .contents-area { padding: 50px 0; }
#subArea-wrap .subArea .contents .prg { margin-bottom: 80px; }
#subArea-wrap .subArea .contents .prg > p { font-size: 17px }
#subArea-wrap.about_us .subArea .contents .prg > div > ul li { display: block; }
/**/
#subArea-wrap .subArea .contents { width: 82% }
#subArea-wrap .subArea .contents .prg > div > ul li { font-size: 17px }
#subArea-wrap.about_us .subArea .contents .prg > div > ul li { font-size: 17px }
#subArea-wrap.about_us .subArea .contents .prg > div { padding-top: 20px }
#subArea-wrap.about_us .subArea .contents .prg > div > ul li:first-child { padding: 0 0 20px }
#subArea-wrap.about_us .subArea .contents .prg > div > ul li span { width: 100%; display: block; padding: 10px 0; }
#subArea-wrap.about_us .subArea .contents .prg > div > ul li { padding: 20px 0; }
#subArea-wrap.about_us .subArea .contents .prg > div > ol li a > div.cont > p.title { font-size: 20px; }
#subArea-wrap.about_us .subArea .contents .prg > div > ol li a > div.cont > p.txt { font-size: 15px }
#subArea-wrap.about_us .subArea .contents .prg > div > ol li a > div.cont > span.outlink_img { transform: scale(.8); }
#subArea-wrap .confirm-area .btn.more { margin-top: 0px; transform: scale(.7); }
#footer .footer_notice dl dt { font-size: 15px; flex-basis: 20%; }
#footer .footer_notice dl dd ul li a { font-size: 15px }
#section6 .footer_notice dl dd ul li a { font-size: 15px }
#subArea-wrap.about_us .subArea .contents .prg > div > ol li a > div.cont > p:first-child { font-size: 15px }
#subArea-wrap.about_us div.cont h2 { font-size: 5.5vw !important; }
#subArea-wrap.about_us div.cont h3 em { font-size: 8.5vw !important; }
#subArea-wrap.about_us div.cont h3 span { font-size: 6vw !important; }
#subArea-wrap.about_us div.cont > p { font-size: 4.5vw !important; }
#subArea-wrap.business .product_list > section ul li { font-size: 5vw; }
#subArea-wrap.contact_us .subArea .contents .prg > div > ul li { width: 100%; display: block; }
#subArea-wrap.contact_us .subArea .contents .prg > div > ul li span { display: block; width: 100%; margin-bottom: 10px }
/****************/
#subArea-wrap.portfolio .subArea .port-menu { padding: 10px 26px; }
#subArea-wrap.portfolio .subArea .port-menu dt { margin-right: 20px; font-size: 16px }
#subArea-wrap.portfolio .subArea .port-menu dt a > img { margin-right: 4px; width: 22px; }
#subArea-wrap.portfolio .subArea .port-menu dd a { font-size: 16px; margin-right: 10px; padding: 12px 0; }
#subArea-wrap.portfolio .subArea .port-menu dd .check_style { font-size: 16px; }
#subArea-wrap.portfolio .subArea .port-menu dd .check_style input[type=checkbox] { width: 18px; height: 18px; }
#subArea-wrap.portfolio .subArea .port-menu dd .input_search { width: 180px; height: 40px; margin-left: 0; }
#subArea-wrap.portfolio .subArea .port-menu dd .input_search input { top: 1; font-size: 16px; width: 120px; padding: 8px 10px 8px 0; }
#subArea-wrap.portfolio .subArea .port-menu dd .input_search a { width: 52px; height: 40px; background-size: 22px auto }
#subArea-wrap.portfolio ul.port-list li { flex-basis: 100% }
#subArea-wrap.portfolio ul.port-list .card-area > p { height: 50vw }
#subArea-wrap.portfolio ul.port-list .card-area > dl dt { font-size: 20px }
/****************/
#subArea-wrap.contact_us .subArea .contents .prg > p { float: left }
#subArea-wrap.contact_us .subArea .contents .prg { float: left }
#subArea-wrap.contact_us .confirm-area { float: left }
#subArea-wrap.contact_us .subArea .contents .prg > div dl { display: block; float: left; width: 100%; margin: 20px 0 16px }
#subArea-wrap .subArea .contents .prg > div dl dd ul { display: block }
#subArea-wrap .subArea .contents .prg > div dl dd ul li { float: left; }
#subArea-wrap.contact_us .subArea .contents .prg > div dl dt { padding-top: 12px; margin-bottom: 10px; }
#subArea-wrap.contact_us .subArea .contents .prg > div dl dd { display: block; float: left; width: 100%; margin: 10px 0 }
#subArea-wrap.contact_us .subArea .contents .prg > div dl dd > select { width: 100% }
#subArea-wrap.contact_us .subArea .contents .prg h3 { padding: 0 0 10px }
#subArea-wrap.contact_us .subArea .contents .prg > div dl.email dd > input { width: 44% }
#subArea-wrap.contact_us .confirm-area { margin-bottom: 150px }
#subArea-wrap.contact_us .subArea .contents .prg p.txt { font-size: 17px }
#subArea-wrap.contact_us .subArea .contents .prg > div > div > div.pre { font-size: 17px }
#subArea-wrap.contact_us .subArea .check_style { font-size: 16px }
#subArea-wrap.contact_us .subArea .contents .prg > div dl dd > span { font-size: 16px }
/* 검색섹션 */
.search_area_content ul.search_area { float: left; width: 100%; margin-right: 0 }
.search_area_content ul li { margin-right: 6px; position: relative }
.search_area_content ul li img.ui-datepicker-trigger { position: relative; top: 2px; margin-left: 3px; vertical-align: top; }
.search_area_content ul li.resveEndDe::before { content: "~"; margin: 0 3px; display: inline-block }
.search_area_content ul li.search_title { margin-left: 0 }
.search_area_content .page_menu { float: right }
.search_area_content ul li { width: 48% !important; float: left }
.search_area_content ul li > input { width: 100% !important }
.readHeader .news-ico { float: left; font-size: 17px; padding: 0 20px 20px; }
/*************/
#subArea-wrap.product .contents .head > h2 { font-size: 7vw }
#subArea-wrap.product .product_list ul li section .txt p { font-size: 24px }
.pd05 #subArea-wrap.product .product_list ul li section .txt p { font-size: 24px }
#subArea-wrap.product .product_list ul li section .txt span { font-size: 17px }
.pd05 #subArea-wrap.product .product_list ul li section .txt span { font-size: 17px; margin-bottom: 8px; }
#subArea-wrap.product .contents .head > p { font-size: 5vw }
.product_list .spec-con > span P { font-size: 17px; }
.product_component .product_spec .spec-con > span { padding-left: 0 !important; }
.pop-layer .pop_box.productArea .body .cont .product_component > div ul li { font-size: 16px; }
.pd05 .product_component .product_spec .spec-con ul li { font-size: 16px !important; }
/****************/
#subArea-wrap.email-collect .subArea .contents-area .cont .cont-header em { font-size: 24px; }
#subArea-wrap.email-collect .subArea .contents-area .cont .cont-header span { font-size: 17px; }
#subArea-wrap.email-collect .subArea .contents-area .cont .cont-body { padding: 30px 40px; font-size: 16px }
#subArea-wrap.email-collect .subArea .contents-area .cont .cont-body dl dt { font-size: 20px; }
#subArea-wrap.email-collect .subArea .contents-area .cont .cont-body dl dd { font-size: 16px; }
pre { font-size: 16px }
.confirm-area .btn { padding: 16px 16px; font-size: 20px; }
/****************/
#section5 .txt-conts dl dt { font-size: 5vw; }
#section5 .contact_list li a span { font-size: 5vw; }
#section5 .contact_list li a p { font-size: 5vw; }
/****************/
.mobile #section1 .txt-conts dl dt { font-size: 7vw; }
.mobile #section1 .txt-conts dl dd { font-size: 3.5vw; }
.mobile #section3 .txt-conts dl dt span { display: inline; margin-left: 10px; }
/****************/
#section4 .item .inner span > br { display: none }
.mobile .section-head { font-size: 5vw; }
.mobile #section4 .item { padding: 0 20px; }
.mobile #section5 .txt-conts dl dt { font-size: 6vw; }
.mobile #section5 .contact_list li a span { padding: 0 0 6px 0; }
.mobile #section5 .contact_list li a p { font-size: 5vw; }
.mobile #section5 .contact_list li a span { font-size: 5vw; }
/****************/
#result .subArea .title_area { display: block; padding: 0 0 30px }
#result .subArea .title_area p { font-size: 36px }
#result .subArea .title_area ul { margin-top: 20px }
#media .subArea .title_area { display: block; padding: 0 0 30px }
#media .subArea .title_area p { font-size: 36px }
#media .subArea .title_area ul { margin-top: 20px }
.readHeader > h3 { font-size: 24px; line-height: 140%; }
/****************/
#subArea-wrap.contact_us .contents .prg h2 { margin-bottom: 10px }
#subArea-wrap.contact_us .subArea .contents .prg > div > ul li:first-child { padding: 26px 0 30px; }
#subArea-wrap.contact_us .subArea .contents .prg > div { padding-top: 10px; width: 100%; }
#subArea-wrap.contact_us .contents .prg h3 { font-size: 22px }
/****************/
#subArea-wrap.contact_us .contents div.pic { display: none }
/****************/
.pd05 .pop-layer .pop_box.productArea .body .cont .product_component > div ul li div.spec-img-wrap { grid-template-columns: 1fr; }
.product_component .product_spec .spec-con { flex-direction: column; }
.product_component .product_spec .spec-con > span { padding-left: 0; }
/****************/
.pop-layer .pop_box.productArea .body .cont ul li { flex-basis: 100%; min-height: auto; margin: 4px !important; }
.pop-layer .pop_box.productArea .body .cont .product_component { display: block }
.pop-layer .pop_box.productArea .body .cont .product_component h2 { padding: 0 0 20px 0 }
.pop-layer .pop_box.productArea .body .cont > p.point-font { font-size: 22px; margin-bottom: 30px; }
.pop-layer .pop_box.productArea .body .cont .product_component > div ol { margin-top: 40px; }
.pop-layer .pop_box.productArea .body .cont .product_component > div ol li { font-size: 20px; word-break: break-all; }
.pop-layer .pop_box.productArea .body .cont .product_component > div ol li span { font-size: 17px; line-height: 130%; }
.pop-layer .pop_box.productArea .body .cont .product_component > div ul { display: block; width: 100% }
.pop-layer .pop_box.productArea .body .cont .product_component > div > ul > li { margin-bottom: 24px !important; width: 100%; }
.pop-layer .pop_box.productArea .body .cont .product_component > div ul li span { display: inline-block; font-size: 17px; line-height: 140%; margin-bottom: 6px; }
/****************/
.pop-layer .pop_box.productArea .body .cont ul li { flex-basis: 100%; min-height: auto; }
.pop-layer .pop_box.productArea .body .cont .product_func { display: block }
.pop-layer .pop_box.productArea .body .cont .product_func h2 { padding: 0 0 20px 0 }
.pop-layer .pop_box.productArea .body .cont > p.point-font { font-size: 22px; margin-bottom: 30px; }
.pop-layer .pop_box.productArea .body .cont .product_func > div ol { margin-top: 40px; }
.pop-layer .pop_box.productArea .body .cont .product_func > div ol li { font-size: 20px; word-break: break-all; }
.pop-layer .pop_box.productArea .body .cont .product_func > div ol li span { font-size: 17px; line-height: 130%; }
.pop-layer .pop_box.productArea .body .product_gallery > p { font-size: 17px; }
/****************/
.pop-layer .pop_box.productArea .body .cont .product_effect { display: block }
.pop-layer .pop_box.productArea .body .cont .product_effect h2 { padding: 0 0 20px 0 }
.qcMenu .cont-area { flex-direction: column; }
.qcMenu::before { height: 446px; }
.qcMenu .con a { flex-direction: row; }
.qcMenu .con { height: 80px; }
.hwCon-area .hw-con { padding: 0; }
/****************/
#subArea-wrap.identity-page .cicontainer .ci-colors > ul.imgbox li img { width: 60% }
.qcMenu .con a.on::after { display: none }
/****************/
body.work-o .pop-layer .pop_box.productArea .body .cont .product_component > div ul li { width: 100%; }
body.work-o .pop-layer .pop_box.productArea .body .cont p.point-font > strong { font-size: 28px; }
/****************/
.mobile #section0 .about .work-o .title > img { width: 80% }
.mobile #section0 .about .work-o .subtitle { font-size: 4vw }
.mobile #section0 .about .work-o .text { font-size: 3.5vw }
/****************/
}
/*ie10*/
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
}
/*ie8,9*/
@media \0screen {
}
