.tabDepth>a, .lastDepth>a, .depth3>a, .depth3>a>span:before, .faq_list>li .q, .faq_list>li .q>.bul, #mVisual .visualRoll .slider>div, #mVisual .vTxtArea .ii, #mVisual .slick-dots>li button, #mVisual .slick-dots>li button:before, #mVisual .vTxt .ii, #mVisual .iconMenu .inConts>a, .mSolution .mSolutionBox .mSolution_txt .btns>a, .mQuick>* .btns>a, #mRoute .routeMap #routeBtn>a, #mAbout .linkAbout>a .thumb img, .mProduct>.list a>.lay, .cont_img .btns>a{transition: all .3s ease-out; transform-origin: 50% 50%;} .historyArea .history_box>.logo>span, .historyArea .history_box>.list:before, #mVisual .vTxt .ii{transition: all .5s ease-out; transform-origin: 50% 50%;} #mVisual .visualRoll .slider .photoBox p{transition: all 1s ease-out; transform-origin: 50% 50%;} /*[s] All Style */ .bg_thumb_box{width:100%; height:100%; background-repeat: no-repeat; background-position: center center; box-sizing: border-box;} img.bg_thumb{opacity: 0;} img.ofi{width:100%; height:100%; object-fit:cover; object-position: center center; font-family: 'object-fit: cover; object-position: center center;';} .tbLayout{width:100%; display:table;} .tbLayout.fixed{table-layout: fixed;} .tbLayout>*{display:table-cell; vertical-align: middle; box-sizing: border-box;} .tbLayout.vat>.td{vertical-align: top;} .tbLayout.full{width:1920px; margin-left:-960px; position: relative; left:50%;} .nTable{width:100%; border-top:2px solid #333; font-size:0; line-height:0;} .nTable>table{width:100%; border-spacing:0; table-layout : fixed;} .nTable>table th, .nTable>table td{padding:3rem 4.5rem; background-color: #fff; border-bottom:1px solid #dadada; font-size:1.7rem; line-height:1.5; color:#666; text-align:left; vertical-align: middle; border-collapse:collapse; empty-cells:show; box-sizing: border-box; word-break:keep-all; word-wrap:break-word;} .nTable>table th{height:5rem; padding:0; border-right:1px solid #dadada; font-size:1.8rem; color: #333; text-align: center;} .nTable>table>thead>tr>th{background-color: #f8f9fb; font-weight: 500;} .nTable>table>tbody>tr>th{} .nTable>table .inT{margin-right:2rem; display:inline-block;} .nTable>table .transportation{} .nTable>table .transportation>li{padding-left:7.5rem; position: relative;} .nTable>table .transportation>li+li{margin-top:2rem;} .nTable>table .transportation>li>p{font-weight: bold; font-size:1.8rem; line-height:3rem; color: #333; position: absolute; left:0; top:0;} .nTable>table .transportation>li>dl{display: flex; justify-content: space-between;} .nTable>table .transportation>li>dl+dl{margin-top:1rem;} .nTable>table .transportation>li>dl>dt{padding-right:1rem; white-space: nowrap;} .nTable>table .transportation>li>dl>dt>span{padding:0 0.8rem; background-color: #a2133f; font-size:1.5rem; line-height:3rem; color: #fff; display:inline-block; border-radius:3px;} .nTable>table .transportation>li>dl>dt.g>span{background-color: #48a824;} .nTable>table .transportation>li>dl>dt.b>span{background-color: #205cc0;} .nTable>table .transportation>li>dl>dt.h>span{background-color: #2faebd;} .nTable>table .transportation>li>dl>dt.r>span{background-color: #da352d;} .nTable>table .transportation>li>dl>dd{width:100%;} .nTable>table .transportation>li>dl>dd .inT{margin-right:1.5rem; font-size:1.6rem; line-height:3rem;} .nTable.en>table .transportation>li{padding-left:8.5rem;} .nTable>table .tit{padding-bottom:0.5rem; font-weight: 400; color: #1b1b1b;} .nTable>table ul.bul{} .nTable>table ul.bul>li{font-weight: 300; font-size:1.7rem; line-height:1.6; color: #666;} .nTable>table .icon{width:14.5rem; margin:0 auto; display: flex; flex-wrap: wrap; flex-direction: row; align-items: center; justify-content: flex-start; text-align: left;} .nTable>table .icon>dt{width:5.8rem;} .nTable>table .icon .i01{width:3.3rem;} .nTable>table .icon .i02{width:3.8rem;} .nTable>table .icon .i03{width:3.5rem;} .nTable>table .icon .i04{width:2.7rem;} .nTable>table .icon .i05{width:3.4rem;} .nTable>table .icon .i06{width:3.6rem;} .nTable.small{margin-top:1.5rem; border:1px solid #2f3334; overflow:hidden;} .nTable.small>table{width:calc(100% + 3px); margin:-1px; background-color: #bcbcbc; border-spacing:1px;} .nTable.small>table th, .nTable.small>table td{padding:10px; border:none; font-weight: 400; font-size:15px; line-height:20px; color: #595959; text-align: center;} .nTable.small>table>thead>tr>th{background-color: #e9e9e9; font-size:16px; color: #262626;} .nTable.small>table>tbody>tr>th{width:auto; border-right:none;} .nTable +.nTable{margin-top:40px;} .tabDepth{width:100%; margin-bottom:35px; font-size:0; line-height:0; text-align: center; box-sizing: border-box; overflow:hidden;} .tabDepth>a{width:19rem; height:46px; background-color: #fdfdfd; border:1px solid #e2e2e2; font-size:18px; line-height:1.2; color: #737373; display:inline-block; vertical-align: top; box-sizing: border-box;} .tabDepth>a+a{margin-left:-1px;} .tabDepth>a>span{display:inline-block; position: relative; top:50%;-webkit-transform: translateY(-50%); transform: translateY(-50%);} .tabDepth>a:hover, .tabDepth>a.active{background-color: #1b54aa; border-color:#1b54aa; color: #fff; z-index:2;} .depth3{width:100%; margin-bottom:70px; font-size:0; line-height:0; text-align: center; box-sizing: border-box; overflow:hidden; position: relative;} .depth3:before{content: ""; width: 100%; height: 1px; background-color: #b0b0b0; display: inline-block; position:absolute; left: 0; top:50%;} .depth3>a{width:260px; height:54px; min-height:5.4rem; background-color: #1952a7; border:1px solid #0c3879; font-size:19px; line-height:1.2; color: #fff; display:inline-block; vertical-align: top; box-sizing: border-box; position: relative; z-index:2;} .depth3>a+a{margin-left:-1px;} .depth3>a>span{display:inline-block; position: relative; top:50%;-webkit-transform: translateY(-50%); transform: translateY(-50%); word-break:keep-all; word-wrap:break-word;} .depth3>a>span:before{content: ""; width: 0; height:2.1rem; margin-top:0.2rem; background:url("../img/bul_d3.png") no-repeat left top; background-size: 2.1rem; display: inline-block; vertical-align: top; position: relative; left:-3.1rem; opacity: 0;} .depth3>a:hover, .depth3>a.active{background-color: #0091db; border-color:#0086cb; z-index:3;} .depth3>a:hover>span:before, .depth3>a.active>span:before{width: 3.1rem; left:0rem; opacity: 1;} .lastDepth{width:100%; margin-bottom:50px; font-size:0; line-height:0; text-align: center; box-sizing: border-box; overflow:hidden; display: flex; justify-content: space-between; } .lastDepth>a{width:100%; height:60px; background-color: #fff; border:1px solid #d3d3d3; font-size:18px; line-height:1.2; color: #666; display:inline-block; vertical-align: top; box-sizing: border-box;} .lastDepth>a+a{margin-left:-1px;} .lastDepth>a>span{display:inline-block; position: relative; top:50%;-webkit-transform: translateY(-50%); transform: translateY(-50%);} .lastDepth>a:hover, .lastDepth>a.active{background-color: #f192a6; border-color:#f192a6; color: #fff; z-index:2;} .lastDepthConts{font-size:0; line-height:0; display:none; overflow:hidden;} .groupTit{padding-bottom:3.5rem;} .groupTit .step{padding-bottom:1rem; font-weight: bold; font-size:2.2rem; line-height:1; color: #23abaf;} h4.txt{margin-bottom:2.5rem; font-weight: bold; font-size:3rem; line-height:1; color: #1b1b1b;} .nTxt{padding-top:2.5rem; font-size:1.7rem; line-height:2.6rem; color: #888;} ul.bul{} ul.bul>li{padding-left:1rem; font-size:1.8rem; line-height:3.2rem; color: #333; position: relative;} ul.bul>li:before{content: "-"; position:absolute; left: 0; top:0px;} ul.star{} ul.star>li{padding-left:2.2rem; font-size:1.7rem; line-height:3.2rem; color: #666; position: relative;} ul.star>li:before{content: "※"; position:absolute; left: 0.4rem; top:0px;} ul.etc{} ul.etc>li{padding-left:3.3rem; font-size:1.7rem; line-height:3.2rem; color: #666; position: relative;} ul.etc>li:before{content: attr(data-title); position:absolute; left: 0; top:0px;} h4.line{margin-bottom:50px; padding-top:2.2rem; font-size:2rem; line-height:1; color: #636363; text-align: center; letter-spacing: -0.03em; position: relative;} h4.line:before{content: ""; width: 2.1rem; height: 0.2rem; background-color: #3a3a3a; display: block; position:absolute; left:50%; top:0; transform: translateX(-50%);} h4.line>strong{font-weight: bold; font-size:4rem; color: #000; display:block;} h4.line>p{padding-top:0.9rem;} h4.line.mt{margin-top:8rem;} h5.bul{margin:6rem 0 2.5rem; padding-left:2.2rem; font-weight: 500; font-size:2.4rem; line-height:1; color: #000; letter-spacing: -0.03em; position: relative;} h5.bul:before{content: ""; width: 1.4rem; height: 1.4rem; border:0.3rem solid #1952a7; display: block; position:absolute; left:0; top:0.5rem; border-radius:999px;} h5.bul .more{padding:0.5rem 1rem; border:1px solid #dadada; font-weight: 400; font-size:1.4rem; color: #666; position: absolute; right:0; top:-0.2rem; display:inline-block;} h6.bul{margin-top:3.5rem;padding:0 0 1rem 1rem; font-weight: 500; font-size:2rem; line-height:1; color: #1b1b1b; letter-spacing: -0.03em; position: relative;} h6.bul:before{content: "-"; position:absolute; left:0; top:0;} h5.bul + .nTxt{margin-top:-1rem;} .f0{font-size:0; line-height:0; text-align: center;} .scrollTb{display:inline-block; font-size:0; line-height:0; } .scrollTb img{max-width:none;} .nTable.scrollTb{padding-bottom:2rem;} .scroll_info{width:100%; padding:2rem 0; font-size:0; line-height:0; position: relative; display:none;} .scroll_info:before{content:"← scroll →"; margin-top:-1rem; font-size:2rem; line-height:1; color: #ff0000; display:inline-block; position: absolute; left:44%; top:50%; animation-duration: 1s; animation-iteration-count:infinite; animation-name: scrollMove; animation-timing-function:ease-In-Out;animation-direction:alternate;} @keyframes scrollMove { from {color: #ff0000; left:42%;} to {color: #006cb7; left:46%;} } .wideFrame{height: 0; padding-bottom: 56.25%; /* 16:9 */ position: relative;} .wideFrame>video, .wideFrame>iframe{width: 100%; height: 100%; position: absolute; left: 0; top: 0;} .wideKakao{width: 100%; margin: 0 auto; position: relative;} .wideKakao>.root_daum_roughmap{width: 100%; padding-bottom: 56.25%;} .wideKakao>.root_daum_roughmap .wrap_map{width: 100%; height: 100%; position: absolute; left: 0; top: 0;} .wideKakao .hide {display: none;} .admGo{font-size:0; line-height:0; position: relative; z-index:7;} .admGo>a{padding:10px 20px; background-color:#f00; font-size:16px; line-height:1.2; color:#fff; display:inline-block; position:absolute; left:0; bottom:0;} .admGos{padding:0.5rem 1rem; background-color:#f00; font-size:1.6rem; line-height:1.2; color:#fff; display:inline-block; position: absolute; right:0; top:0; z-index:7;} .arrBtn{padding:0 1.8rem; border:0.2rem solid #fff; font-size:16px; line-height:4rem; color: #fff; display:inline-block; border-radius:99px;} .arrBtn>span{padding-right:6rem; background: url("../img/main/arr_mBtns_w.png") no-repeat right center; background-size:3.1rem; display:inline-block;} .arrBtn.black{border-color:#333; color: #333;} .arrBtn.black>span{background-image: url("../img/main/arr_mBtns.png");} select.base{width:100%; height:4rem; padding:0 4rem 0 2rem; background:#fff url('/theme/prix/img/bg_select_arr_m.png') no-repeat right center; background-size:3.3rem; border:1px solid #666; font-weight: 400; font-size:1.5rem; line-height:3.8rem; color: #666; -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius:5px; box-sizing:border-box;} select.base::-ms-expand{display:none;} /*[e] All Style */ /*[s] Main Popup Style */ #hd_pop {z-index:101;position:relative;margin:0 auto;height:0} #hd_pop h2 {position:absolute;font-size:0;line-height:0;overflow:hidden} .hd_pops{width:auto !important; max-width:100%; height:auto !important; background-color:#fff; border:1px solid #333; position:absolute; display:block; overflow:hidden; box-sizing:border-box;} .hd_pops img{width:100%} .hd_pops_con{} .hd_pops_footer{padding:0; background-color:#333; font-size:1.4rem; color:#fff; text-align:left;position:relative} .hd_pops_footer:after {display:block;visibility:hidden;clear:both;content:""} .hd_pops_footer button{padding:1rem; border:0; color:#fff} .hd_pops_footer .hd_pops_reject{text-align:left} .hd_pops_footer .hd_pops_close{position:absolute;top:0;right:0} /*[e] Main Popup Style */ /*[s] Main Style */ .mScrolls{width:100%; font-size:0; line-height:0; text-align: center; position: fixed; left:0; bottom:40px; z-index:8; display:none; animation-duration: .7s; animation-iteration-count:infinite; animation-name: scrollDown; animation-timing-function:ease-in-out; animation-direction:alternate; } @keyframes scrollDown { from {bottom:50px; opacity:1;} to {bottom:30px; opacity:0.5} } #fullpage{background-color: rgba(0,0,0,0.3); text-align:left; font-size:0; line-height:0; position: relative; z-index:1;} #fullpage .fp-tableCell{padding-bottom:9.5rem;} #fullpage .section.fp-auto-height .fp-tableCell{padding-bottom:9rem;} #fullpage .section[data-anchor]{background-repeat: no-repeat; background-position: center center; background-size: cover;} #fullpage .section[data-anchor="first"]{background-image: url("../img/main/bg_main01.jpg");} #fullpage .section[data-anchor="second"]{background-image: url("../img/main/bg_main02.jpg");} #fullpage .section[data-anchor="third"]{background-image: url("../img/main/bg_main03.jpg");} #fullpage .section .ii{color: #222; position: relative; top:100px; opacity: 0; transition: all 0.2s ease-out; transform-origin: 50% 50%; -webkit-transition-delay: .0s; transition-delay: .0s;} #fullpage .section .i01{-webkit-transition-delay: .5s; transition-delay: .5s;} #fullpage .section .i02{-webkit-transition-delay: .55s; transition-delay: .55s;} #fullpage .section .i03{-webkit-transition-delay: .6s; transition-delay: .6s;} #fullpage .section .i04{-webkit-transition-delay: .65s; transition-delay: .65s;} #fullpage .section .i05{-webkit-transition-delay: .7s; transition-delay: .7s;} #fullpage .section .i06{-webkit-transition-delay: .75s; transition-delay: .75s;} #fullpage .section .i07{-webkit-transition-delay: .8s; transition-delay: .8s;} #fullpage .section .i08{-webkit-transition-delay: .85s; transition-delay: .85s;} #fullpage p.title{padding-bottom:3.2rem; font-weight: bold; font-size:6rem; line-height:1;} #fullpage p.title:before{content: ""; width: 5rem; height: 0.4rem; background-color: #26282b; display: inline-block; position:absolute; left: 0; bottom:0px;} #fullpage p.tit{margin-top:4.5rem; font-weight: 300; font-size:4rem; line-height:1;} #fullpage p.txt{margin-top:2.5rem; font-weight: 400; font-size:1.8rem; line-height:1.5;} #fullpage p.btns{margin-top:7rem;} #fullpage p.btns>a{width:16rem; height:5rem; background-color: #222; font-size:1.4rem; line-height:1; color: #ccc; display: flex; flex-wrap: wrap; flex-direction: row; align-content: center; justify-content: center; -ms-flex-align:center;} #fullpage .section.active .ii{top:0; opacity: 1; transition: all 0.6s ease-out; transition-delay: .6s;} #fullpage.y2025 .fp-tableCell{padding:9.5rem 0 0;} #fullpage.y2025 .section .inConts{display: flex; align-items: center; justify-content: flex-end;} #fullpage.y2025 .section .conts-in{width:65rem; display:inline-block;} #fullpage.y2025 .section .ii{} #fullpage.y2025 .section.w .ii{color: #fff; text-shadow: 0 0 4px rgba(0, 0, 0, 0.8)} #fullpage.y2025 .section.w p.title:before{background-color: #fff;} #fullpage.y2025 .section[data-anchor="first"]{background-image: url("../img/main/bg_main001.jpg");} #fullpage.y2025 .section[data-anchor="second"]{background-image: url("../img/main/bg_main002.jpg?var=2026-04-14"); background-position: left center;} #fullpage.y2025 .section[data-anchor="third"]{background-image: url("../img/main/bg_main003.jpg"); background-position: left center;} #fullpage.y2025 .section.fp-auto-height .fp-tableCell{padding:0 !important;} /*[e] Main Style */ /*[s] Sub Style */ .newMedal{display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: center; gap: 3rem; max-width: 1000px; width: 74%; margin: 0 auto;} .newMedal .imgArea{width: calc((100% - 6rem)/3); display: flex; justify-content: center; align-items: flex-end; max-width: 200px;} .newMedal .imgArea:nth-child(n + 4) {width: calc((100% - 9rem)/4);} .medal {display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: -7rem;} .medal >div {width: 20%; flex: 1;} .medal-2025{margin-bottom:0; padding-top:12rem; display: flex; align-items: center; justify-content: center; } /* */ .introduction-area{} .introduction-conts{padding-bottom:12rem; background-repeat: no-repeat; background-position: center center; background-size: cover;} .introduction-conts.ceo{background-image: url("../img/sub/bg_introduction01.jpg");} .introduction-conts.people{background-color: #f2f2f2;} .introduction-conts .area-ceo{font-size:1.8rem; line-height:1.6; color: #222;} .introduction-conts .area-ceo>*+*{margin-top:3rem;} .introduction-conts .area-ceo .title{font-weight: bold;} .introduction-conts .area-ceo .text{color: #666;} .introduction-conts .area-ceo .name{font-weight: 500;} .introduction-conts .area-ceo .thumb{width:100%; font-size:0; line-height:0; overflow: hidden;} .introduction-conts .area-ceo .thumb>ul{margin:-1.8rem 0 0 -1.8rem;} .introduction-conts .area-ceo .thumb>ul>li{width:33.3333%; padding:1.8rem 0 0 1.8rem; display:inline-block; vertical-align: top;} .introduction-conts .area-ceo .thumb>ul>li img{border-radius:1rem;} .introduction-conts .area-people .thumb .tab{text-align:center; display: flex; flex-wrap: wrap; gap: 4rem;} .introduction-conts .area-people .thumb .tab li{display:inline-block; width: calc((100% - 12rem)/4);} .introduction-conts .area-people .thumb .tab li a{display:block;} .introduction-conts .area-people .thumb .tab li a div{position:relative; width:160px; height:160px; border-radius:50%; box-shadow:3px 3px 10px #bbb; overflow:hidden; margin: 0 auto;} .introduction-conts .area-people .thumb .tab li a div:before{content:""; position:absolute; top:0; left:0; width:100%; height:100%; border:2px solid transparent; border-radius:50%;} .introduction-conts .area-people .thumb .tab li a div img{max-width:100%;} .introduction-conts .area-people .thumb .tab li a span{display:block; margin-top:2rem; font-size:1.8rem; color:#888;} .introduction-conts .area-people .thumb .tab li.on a div:before{border-color:#ffcc00;} .introduction-conts .area-people .thumb .tab li.on a span{font-weight:700; color:#222;} .introduction-conts .area-people .thumb .profile{margin-top:4.5rem; padding:8rem 4rem; border:1px solid #ddd; background:#fff;} .introduction-conts .area-people .thumb .profile .list{display:none;} .introduction-conts .area-people .thumb .profile .list01{display:block;} .introduction-conts .area-people .thumb .profile .list .imgbox{display:flex; justify-content:right; position:relative; height:49rem;} .introduction-conts .area-people .thumb .profile .list .imgbox .rbox{width:52rem;} .introduction-conts .area-people .thumb .profile .list .imgbox .rbox h1{margin-bottom:2rem; padding-bottom:2rem; font-size:3rem; font-weight:700; color:#222; letter-spacing:1.5rem !important; border-bottom:1px solid #222;} .introduction-conts .area-people .thumb .profile .list .imgbox .rbox .img{position:absolute; top:0; left:0;} .introduction-conts .area-people .thumb .profile .list .imgbox .rbox .img img{max-width:100%;} .introduction-conts .area-people .thumb .profile .list .imgbox .rbox h2{font-size:2.5rem; font-weight:700; color:#222; line-height:3rem;} .introduction-conts .area-people .thumb .profile .list .imgbox .rbox h2>span{font-size:1.8rem;} .introduction-conts .area-people .thumb .profile .list .imgbox .rbox h3{margin:1.5rem 0 2rem; font-size:1.8rem; color:#d2b472;} .introduction-conts .area-people .thumb .profile .list .imgbox .rbox ul:last-child{margin-top:2rem;} .introduction-conts .area-people .thumb .profile .list .imgbox .rbox ul li{margin-bottom:0.2rem;font-size:1.6rem; color:#666;} .introduction-conts .area-people .thumb .profile .list .imgbox .rbox ul li>span{font-size:1.4rem;} .introduction-conts .area-people .thumb .profile .list .text{margin-top:7.5rem;} .introduction-conts .area-people .thumb .profile .list .text div{margin-bottom:3rem; padding-bottom:1.5rem; border-bottom:1px solid #222;} .introduction-conts .area-people .thumb .profile .list .text div img{vertical-align:middle; margin-right:1rem;} .introduction-conts .area-people .thumb .profile .list .text div strong{font-size:2rem; color:#222; vertical-align:middle;} .introduction-conts .area-people .thumb .profile .list .text ul li{position:relative; margin-bottom:0.5rem; font-size:1.6rem; color:#666;} .introduction-conts .area-people .thumb .profile .list .text ul.disc li{padding-left:2rem;} .introduction-conts .area-people .thumb .profile .list .text ul.disc li:before{content:""; position:absolute; top:13px; left:1rem; width:2px; height:2px; border-radius:50%; background:#666;} .introduction-conts .area-video h1{font-size:4rem; font-weight:700; color:#222; text-align:center;} .introduction-conts .area-video .box{margin-top:3.5rem;} .introduction-conts.review{background:#e6e8f6;} .introduction-conts.review .inConts .pageTop{padding-bottom:0;} .introduction-conts.review .inConts .pageTop h3:before{display:none;} .introduction-conts .area-review .more{margin-top:7rem; text-align:center;} .introduction-conts .area-review .more a{display:inline-block; width:26rem; height:6.3rem; font-size:1.8rem; color:#222; line-height:6.3rem; border:1px solid #222; border-radius:5px;} .introduction-conts .area-review .more a img, .introduction-conts .area-review .more a span{vertical-align:middle;} .introduction-conts .area-review .more a span:last-child{font-weight:300;} .introduction-conts.gal{background:#f6f1e6;} .introduction-conts .area-gal{padding-top:12rem;} .introduction-conts .area-gal>h1{font-size:4rem; font-weight:700; color:#222; text-align:center;} .introduction-conts .area-gal>p{font-size:1.8rem; color:#666; text-align:center; line-height:2.6rem;} .introduction-conts .area-direction + .area-direction{margin-top:10rem;} .introduction-conts .area-direction .map{height:72rem;} .introduction-conts .area-direction .add{padding:6rem 5rem;} .introduction-conts .area-direction .add .box{display:flex;} .introduction-conts .area-direction .add .box>div:nth-child(1){width:20rem;} .introduction-conts .area-direction .add .box>div:nth-child(2){width:calc(100% - 20rem);} .introduction-conts .area-direction .add .box div{font-size:1.7rem; color:#666;} .introduction-conts .area-direction .add .box div strong{color:#222;} .introduction-conts .area-direction .add .box2{margin-top:6rem;} .introduction-conts .area-direction .add .box2 .bus{} .introduction-conts .area-direction .add .box2 .bus div:nth-child(1){margin-bottom:5rem; padding-bottom:5rem; border-bottom:1px solid #ddd;} .introduction-conts .area-direction .add .box2 .bus div strong, .introduction-conts .area-direction .add .box2 .bus div span{display:inline-block; vertical-align:top;} .introduction-conts .area-direction .add .box2 .bus div strong{width:10rem; height:4rem; margin-right:3rem; color:#fff; text-align:center; line-height:4rem; border-radius:1rem; background:#000;} .introduction-conts .area-direction .add .box2 .bus div span{width:calc(100% - 13.5rem); line-height:2.4rem;} .introduction-conts .area-direction .add .box2 .bus div:nth-child(2) strong{background:#999;} .introduction-conts.online{height:40rem; background:url(../img/sub/img_online.jpg) no-repeat center / cover;} .introduction-conts .area-online{padding-top:13rem; text-align:center;} .introduction-conts .area-online h1{font-size:3rem; font-weight:700; color:#fff;} .introduction-conts .area-online p{margin:2rem 0 4rem; font-size:1.8rem; color:#fff;} .introduction-conts .area-online .more a{display:inline-block; width:20rem; height:6rem; font-size:1.8rem; color:#ccc; line-height:6rem; border-radius:1rem; background:#302f2e;} .introduction-conts.advantage{padding-bottom:0;} #container .introduction-conts.advantage .inConts{max-width:120rem;} .introduction-conts.advantage .inConts{padding:0;} .introduction-conts .area-advantage01{margin-bottom:-23.6rem; position: relative; z-index:2;} .introduction-conts .area-advantage01 .inConts{position:relative; display: flex; align-items: center; justify-content: center;} .introduction-conts .area-advantage01 .inConts div{} .introduction-conts .area-advantage01 .inConts div img{} .introduction-conts .area-advantage02{} .introduction-conts .area-advantage02 .inConts{text-align:center;} .introduction-conts .area-advantage02 .inConts h2{font-size:3rem; font-weight:700; color:#222;} .introduction-conts .area-advantage02 .inConts h2 strong{color:#cca855;} .introduction-conts .area-advantage02 .inConts .area-box{margin-top:4rem; padding:5rem 0; background:#fff;} .introduction-conts .area-advantage02 .inConts .area-box>p{margin:4rem 0 3rem;} .introduction-conts .area-advantage02 .inConts .area-box>p span{display:inline-block; padding:1rem 3rem; font-size:1.8rem; font-weight:700; color:#fff; border-radius:3rem; background:#cca855;} .introduction-conts .area-advantage02 .inConts .area-box .img2{display:flex; justify-content:center; align-items:center;} .introduction-conts .area-advantage02 .inConts .area-box .img2 .arrow{margin:0 3rem;} .introduction-conts .area-advantage02 .inConts .area-box .img2 div p{margin-top:2rem; font-size:1.8rem; font-weight:700; color:#a2a2a2;} .introduction-conts .area-advantage02 .inConts .area-box .img2 div:last-child p{color:#000;} /* .introduction-conts .area-advantage03{position:relative; transform:translateZ(0);} .introduction-conts .area-advantage03:before{content:""; position:absolute; top:0; left:0; z-index:-1; width:50rem; height:100%; background:#f6f1e6;} */ .introduction-conts .area-advantage03 .inConts{padding:9rem 0;} .introduction-conts .area-advantage03 .inConts>h2{text-align:center;} .introduction-conts .area-advantage03 .inConts>p{margin-top:2rem; font-size:2.2rem; font-weight:300; color:#222; text-align:center;} .introduction-conts .area-advantage03 .inConts>p strong{font-weight:400;} .introduction-conts .area-advantage03 .inConts .area-box{display:flex; margin-top:5rem;} .introduction-conts .area-advantage03 .inConts .area-box>div:first-child{padding-right:5rem;} .introduction-conts .area-advantage03 .inConts .area-box>div{width:50%;} .introduction-conts .area-advantage03 .inConts .area-box .sbox{text-align:left;} .introduction-conts .area-advantage03 .inConts .area-box .sbox div:last-child{margin-top:5rem;} .introduction-conts .area-advantage03 .inConts .area-box .sbox div p{font-size:2.2rem; font-weight:700; color:#222;} .introduction-conts .area-advantage03 .inConts .area-box .sbox div p strong{color:#cca855;} .introduction-conts .area-advantage03 .inConts .area-box .sbox div ul{margin-top:3rem;} .introduction-conts .area-advantage03 .inConts .area-box .sbox div ul li{margin-bottom:1rem; padding:0 0 0 3.2rem; font-size:1.8rem; font-weight:300; color:#222; background:url(../img/sub/img_advantage_check.png) no-repeat left 3px;} .introduction-conts .area-advantage04{border-top:1px solid #cca855;} .introduction-conts .area-advantage04 .inConts{padding:32rem 0 10rem;} .introduction-conts .area-advantage04 .inConts>h2{margin-bottom:7rem; font-size:3rem; font-weight:700; color:#222; text-align:center;} .introduction-conts .area-advantage04 .inConts .area-box ul{margin-top:4.5rem; text-align:left;} .introduction-conts .area-advantage04 .inConts .area-box li{position:relative; margin-bottom:3rem; padding:0 0 3rem 3.5rem; font-size:1.8rem; font-weight:300; color:#333; line-height:2.5rem; border-bottom:1px solid #ddd;} .introduction-conts .area-advantage04 .inConts .area-box li span{display:block; position:absolute; top:0; left:0; width:2.5rem; height:2.5rem; font-size:1.8rem; color:#fff; text-align:center; line-height:2.5rem; border-radius:50%; background:#d2b472;} .introduction-conts.advantage .inConts{text-align:center;} /* area-gene 20230601 이정현 */ .area-gene{padding: 10rem 0;} .area-gene .inConts * span{color: #cca855 !important;} .area-gene .inConts > h4{font-size: 3rem; line-height: 1; font-weight: bold; color: #222222; text-align: center;} .area-gene .inConts > p{font-size: 2.2rem; line-height: 1; font-weight: bold; color: #ffffff; text-align: center; display: inline-block; padding: 1.5rem 6rem; background: #cca855; margin: 1.5rem auto 5rem; border-radius: 30px;} .box-gold{font-size: 3.6rem; line-height: 1; font-weight: bold; color: #ffffff; text-align: center; display: inline-block; padding: 2rem 6rem; background: #cca855; margin: 1.5rem auto 5rem; border-radius: 99px;} .geneArea .imgZone{display: flex; flex-wrap: wrap;} .geneArea .imgZone .img{width: calc((100%)/2);} .geneContents{padding: 0 3rem; background: #fff;} .geneTitle{padding: 6rem 0 4rem; display: flex; flex-wrap: wrap; gap: 1rem;} /* border-bottom: 1px solid #eeeeee; */ .geneTitle .titleZone{display: flex; gap: 1.5rem; flex-wrap: wrap; } /*width: calc((100% - 1rem)/2);*/ .geneTitle .titleZone .imgArea{width: 9rem;} .geneTitle .titleZone .textArea{width: calc(100% - 9rem - 1.5rem);} .geneTitle .titleZone .textArea h4{font-size: 2.2rem; line-height: 1; color : #222222 ; margin-bottom: 1rem; text-align: left; font-weight: bold;} .geneTitle .titleZone .textArea p{font-size: 1.8rem; line-height: 2.8rem; color : #666666 ;text-align: left} .geneEtc{padding: 5rem 0; } .geneEtc h4{font-size: 2.2rem; line-height: 3rem; color: #222; font-weight: bold; text-align:left ; margin-bottom: 1.5rem;} .geneEtc p{font-size: 1.8rem; line-height: 2.8rem; font-weight: 500; color: #666666; text-align:left} /* area-gene 20230601 이정현 */ .introduction-conts .area-advantage05 .inConts>h2{font-size:3rem; color:#222;} .introduction-conts .area-advantage05 .inConts .img{margin:5rem 0;} .introduction-conts .list{padding:11rem 0 11rem;} .introduction-conts .area-advantage05 .list{padding-top:0;} .introduction-conts .inConts .list .num strong{display:inline-block; width:3rem; height:3rem; font-size:1.8rem; color:#fff; line-height:3rem; border-radius:50%; background:#d2b472;} .introduction-conts .inConts .list>p{margin:2rem 0 10rem; font-size:3rem; font-weight:700; color:#222;} .introduction-conts .inConts .list .largebox, .introduction-conts .inConts .list .imgbox3{padding:5rem 0; background:#fff;} .introduction-conts .inConts .list .imgbox3{display:flex; justify-content:center;} .introduction-conts .inConts .list .imgbox3 div{margin:0 1rem;} .introduction-conts .inConts .list .text{margin-top:5rem;} .introduction-conts .inConts .list .text .round{display:inline-block; padding:1rem 3rem; font-size:1.8rem; font-weight:700; color:#fff; border-radius:30px; background:#d2b472;} .introduction-conts .inConts .list .sbox{margin-top:10rem;} .introduction-conts .inConts .list .sbox .box{margin-top:5rem; text-align:left;} .introduction-conts .inConts .list .sbox .box>p{position:relative; padding:0 0 2rem 1.4rem; font-size:2rem; color:#222; line-height:normal; border-bottom:1px solid #222;} .introduction-conts .inConts .list .sbox .box>p:before{content:""; position:absolute; top:7px; left:0; height:15px; border-left:4px solid #d2b472;} .introduction-conts .inConts .list .sbox .box>p a{display:block; position:relative; float:right; margin-top:-1.5rem; padding:1rem 3rem 1rem 1rem; font-size:1.5rem; color:#fff; border-radius:0.5rem; background:#9c9c9c;} .introduction-conts .inConts .list .sbox .box>p a:before{content:""; position:absolute; top:50%; right:1rem; transform:translateY(-50%); border:8px solid #fff; border-bottom:none; border-left:6px solid transparent; border-right:6px solid transparent; transition:all 0.3s;} .introduction-conts .inConts .list .sbox .box>p a.on:before{transform:translateY(-50%) rotate(180deg);} .introduction-conts .inConts .list .sbox .box ul{display:none;} .introduction-conts .inConts .list .sbox .box div p, .introduction-conts .inConts .list .sbox .box ul li{margin-top:2rem; font-size:1.8rem; font-weight:300; color:#666;} .introduction-conts .area-advantage09 .inConts .list .imgbox{margin-bottom:18rem;} .introduction-conts .area-advantage09 .inConts .list .imgbox p{font-size:2.4rem; font-weight:700; color:#222;} .introduction-conts .area-advantage09 .inConts .list .imgbox div{position:relative; margin-top:4rem;} .introduction-conts .area-advantage09 .inConts .list .imgbox div span{display:block; position:absolute; top:13rem; left:50%; width:15rem; margin-left:-36rem; font-size:1.6rem; color:#222; text-align:right;} .introduction-conts .area-advantage09 .inConts .list .imgbox div ul{position:absolute; top:24rem; left:50%; margin-left:22.5rem; padding:2rem 2rem 1rem; border:1px solid #ddd;} .introduction-conts .area-advantage09 .inConts .list .imgbox div ul li{position:relative; margin-bottom:1rem; padding-left:2.5rem;font-size:1.6rem; color:#222; text-align:left; line-height:1.5rem;} .introduction-conts .area-advantage09 .inConts .list .imgbox div ul li:before{content:""; position:absolute; top:0; left:0; width:1.5rem; height:1.5rem; border-radius:50%; border:1px solid #d0c729; background:#f9f916;} .introduction-conts .area-advantage09 .inConts .list .imgbox div ul li:nth-child(2):before{border-color:#d38e12; background-color:#fca915;} .introduction-conts .area-advantage09 .inConts .list .imgbox div ul li:nth-child(3):before{border-color:#2ea048; background-color:#21e855;} .introduction-conts .area-advantage09 .inConts .list .imgbox div ul li:nth-child(4):before{border-color:#29a0cd; background-color:#4beff7;} .introduction-conts .area-advantage-gray{width:100vw; margin-left:-50vw; background-color:#f7f7f7; position: relative; left:50%;} .introduction-conts .area-advantage-beige{width:100vw; margin-left:-50vw; background-color:#f6f1e6; position: relative; left:50%;} .introduction-conts .area-advantage-gray.p110{padding: 11rem 0;} .introduction-conts .area-advantage12{height:41.2rem; background:url(../img/sub/img_advantage12_bg.jpg) no-repeat center / cover;} .introduction-conts .area-advantage12 .inConts{padding-top:11rem; text-align:center;} .introduction-conts .area-advantage12 .inConts h1{position:relative; padding-bottom:4rem; font-size:3rem; font-weight:700; color:#222; line-height:3.8rem;} .introduction-conts .area-advantage12 .inConts h1:before{content:""; position:absolute; bottom:0; left:50%; transform:translateX(-50%); width:4rem; border-bottom:1px solid #222;} .introduction-conts .area-advantage12 .inConts p{margin-top:3rem; font-size:1.8rem; font-weight:300; color:#222; line-height:2.8rem;} .introduction-conts .inConts .imgbox3{display:flex; justify-content:space-between;} .introduction-conts .inConts .imgbox3 div{box-shadow:0 5px 10px #ddd; border-radius:10px;} .introduction-conts.advantage .profile{margin-top:7rem; padding-bottom:11rem; text-align:left;} .introduction-conts.advantage .profile .profile_list .imgbox{display:flex; justify-content:right; position:relative; height:49rem;} .introduction-conts.advantage .profile .profile_list .imgbox .rbox{width:52rem;} .introduction-conts.advantage .profile .profile_list .imgbox .rbox h1{margin-bottom:2rem; padding-bottom:2rem; font-size:3rem; font-weight:700; color:#222; letter-spacing:1.5rem !important; border-bottom:1px solid #222;} .introduction-conts.advantage .profile .profile_list .imgbox .rbox .img{position:absolute; top:0; left:0; width: 46%;} .introduction-conts.advantage .profile .profile_list .imgbox .rbox .img img{max-width:100%;} .introduction-conts.advantage .profile .profile_list .imgbox .rbox h2{font-size:2.5rem; font-weight:700; color:#222; line-height:3rem;} .introduction-conts.advantage .profile .profile_list .imgbox .rbox h3{margin:1.5rem 0 2rem; font-size:1.8rem; color:#d2b472;} .introduction-conts.advantage .profile .profile_list .imgbox .rbox ul:last-child{margin-top:2rem;} .introduction-conts.advantage .profile .profile_list .imgbox .rbox ul li{margin-bottom:0.2rem;font-size:1.6rem; color:#666;} .introduction-conts.advantage .profile .profile_list .text{margin-top:7.5rem;} .introduction-conts.advantage .profile .profile_list .text div{margin-bottom:3rem; padding-bottom:1.5rem; border-bottom:1px solid #222;} .introduction-conts.advantage .profile .profile_list .text div img{vertical-align:middle; margin-right:1rem;} .introduction-conts.advantage .profile .profile_list .text div strong{font-size:2rem; color:#222; vertical-align:middle;} .introduction-conts.advantage .profile .profile_list .text ul li{margin-bottom:0.5rem; font-size:1.6rem; color:#666;} .introduction-conts.advantage .profile .sbox{margin-top:7rem; text-align:center;} .introduction-conts.advantage .profile .sbox .imgbox p{padding:2rem 0; font-size:2rem; font-weight:700; color:#fff; background:#cca855;} .introduction-conts.advantage .profile .sbox .textbox{margin-top:8rem;} .introduction-conts.advantage .profile .sbox .textbox>h2{position:relative; margin:3rem 0 2rem; padding-bottom:2rem; font-size:2.8rem; color:#222;} .introduction-conts.advantage .profile .sbox .textbox>h2:before{content:""; position:absolute; bottom:0; left:50%; transform:translateX(-50%); width:3rem; border-bottom:1px solid #cca855;} .introduction-conts.advantage .profile .sbox .textbox p{font-size:1.8rem; color:#666; line-height:2.8rem;} .introduction-conts.advantage .profile .sbox .textbox .imgbox4{margin-top:6rem;} .introduction-conts.advantage .profile .sbox .textbox .imgbox4 div{display:inline-block; width:235px; height:235px; margin:0 1rem; border-radius:50%; overflow:hidden; box-shadow:5px 5px 10px #ddd;} .introduction-conts .area-advantage14{} .introduction-conts .area-advantage14 .inConts{padding-top:11rem;} .introduction-conts .area-advantage14 .inConts h1{font-size:4rem; font-weight:700; color:#222;} .introduction-conts .area-advantage14 .performanceSlide{margin-top:0;} .introduction-conts .area-advantage15{position:relative; transform:translateZ(0); height:42rem;} .introduction-conts .area-advantage15:before{content:""; position:absolute; top:0; left:0; z-index: -1; width:50%; height:100%; background:url(../img/sub/img_advantage15_bg01.jpg) no-repeat right center / cover;} .introduction-conts .area-advantage15:after{content:""; position:absolute; top:0; left:50%; z-index: -1; width:50%; height:100%; border-left:1px solid #fff; background:url(../img/sub/img_advantage15_bg02.jpg) no-repeat right center / cover;} .introduction-conts .area-advantage15 .vs{position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); font-size:5rem; color:#cca855;} .introduction-conts .area-advantage15 .vs:before{content:""; position:absolute; top:50%; left:50%; z-index: -1; transform:rotate(45deg) translate(-50%, -50%); transform-origin:left top; width:13rem; height:13rem; border-radius:5px; background:#fff;} .introduction-conts .area-advantage15 .text{position:absolute; top:50%; left:0; transform:translateY(-50%); width:50%; padding-right:15rem; font-size:2.5rem; color:#fff; text-align:right; line-height:3.5rem;} .introduction-conts .area-advantage15 .text2{left:50%; padding-right:0; padding-left:15rem; font-weight:700; text-align:left;} .introduction-conts .area-advantage15 .text strong{display:inline-block; padding:1rem 2rem; font-size:4rem; color:#fff; background:#f00;} .introduction-conts .area-advantage16{background:#f7f7f7;} .introduction-conts .area-advantage17 .inConts{padding-bottom:11rem;} .introduction-conts .area-advantage17 .inConts .graph01{padding:5rem 0; border:1px solid #ddd; background:#fdfbf8;} .introduction-conts .area-advantage17 .inConts .graph01 p{margin-top:3rem; font-size:2.2rem; color:#222;} .introduction-conts .area-advantage17 .inConts .graph01 p span{color:#cca855;} .introduction-conts .area-advantage17 .inConts .graph02{margin-top:14rem;} .introduction-conts .area-advantage17 .inConts .graph02 p{margin-bottom:2rem; font-size:1.8rem; font-weight:700; color:#cca855;} .introduction-conts .area-advantage17 .inConts .graph02 p strong{display:inline-block; padding:1rem 3rem; color:#fff; border-radius:30px; background:#cca855;} .introduction-conts .area-advantage18{height:43rem; background:url(../img/sub/img_advantage18_bg.jpg) no-repeat center / cover;} .introduction-conts .area-advantage18 .inConts{padding-top:12rem;} .introduction-conts .area-advantage18 .inConts h2{margin-top:2rem; font-size:3rem; color:#000;} .introduction-conts.hearingaid{padding-bottom:0;} #container .introduction-conts.hearingaid .inConts{max-width:120rem;} .introduction-conts.hearingaid .inConts{padding:0;} .area-hearingaid01 .area-box{height:61.5rem; background:url(../img/sub/img_hearingaid01_bg.jpg) no-repeat center / cover;} .area-hearingaid01 .area-box .inConts .textbox{padding-top:12rem;} .area-hearingaid01 .area-box .inConts .textbox .quiz{font-size:2.6rem; font-weight:700; color:#222;} .area-hearingaid01 .area-box .inConts .textbox .quiz strong{margin-right:2rem; font-size:5rem;} .area-hearingaid01 .area-box .inConts .textbox ul{margin-top:6rem;} .area-hearingaid01 .area-box .inConts .textbox ul li{position:relative; padding-left:5.8rem; font-size:2.6rem; font-weight:700; color:#222;} .area-hearingaid01 .area-box .inConts .textbox ul li>span{display:block; position:absolute; top:0; left:0; width:4.8rem; height:4.8rem; font-size:2.2rem; font-weight:700; color:#fff; text-align:center; line-height:4rem; border-radius:50%; background:#d2b472;} .area-hearingaid01 .area-box .inConts .textbox ul li>strong{display:inline-block; width:20rem; margin:0 2rem -0.5rem; border-bottom:2px solid #222;} .area-hearingaid01 .area-box .inConts .textbox ul li div{margin-top:5rem;} .area-hearingaid01 .area-box .inConts .textbox ul li div p{margin-bottom:3rem; font-size:2rem; font-weight:300; color:#666;} .area-hearingaid01 .area-box .inConts .textbox ul li div p span{font-size:2rem; font-weight:700; color:#888;} .area-hearingaid01 .area-box .inConts .textbox ul li div p strong{display:inline-block; width:14rem; margin:0 1rem -0.5rem; padding-bottom:0.5rem; text-align:center; border-bottom:2px solid #222;} .introduction-conts .inConts .tab-slide{margin-bottom:7rem;} .introduction-conts .inConts .tab-slide ul{display:flex;} .introduction-conts .inConts .tab-slide ul li{display:table; width:16.6%; height:7.5rem; text-align:center; border:1px solid #ddd; cursor:pointer;} .introduction-conts .inConts .tab-slide02 ul li{width:20%;} .introduction-conts .inConts .tab-slide ul li.on{border-color:#d2b472; background:#d2b472;} .introduction-conts .inConts .tab-slide ul li span{display:table-cell; vertical-align:middle;} .introduction-conts .inConts .tab-slide ul li span.on{display:none;} .introduction-conts .inConts .tab-slide ul li.on span.on{display:table-cell;} .introduction-conts .inConts .tab-slide ul li.on span.off{display:none;} .introduction-conts .inConts .tab-slide ul li span img{max-width:none; height:5rem;} .introduction-conts .inConts .tab-slide ul li:last-child span img{height:6rem;} .introduction-conts .area-hearingaid02 .inConts .tab-slide ul li:nth-child(4) span img, .introduction-conts .area-hearingaid04 .inConts .tab-slide ul li:nth-child(4) span img, .introduction-conts .area-hearingaid07 .inConts .tab-slide ul li:nth-child(4) span img{height:3rem;} .introduction-conts .inConts .tabbox{display:none; position:relative; text-align:center;} .introduction-conts .inConts .tabbox1, .introduction-conts .inConts .tabbox01, .introduction-conts .inConts .tabbox001{display:block;} .introduction-conts .inConts .tabbox .swiper{overflow:hidden;} /* swiper button */ .introduction-conts.hearingaid .inConts .tabbox .swiperbtn{position:absolute; top:50%; z-index: 9; transform:translateY(-50%); width:10rem; height:10rem; border-radius:50%; cursor:pointer; background:#fff;} .introduction-conts.hearingaid .inConts .tabbox .button-prev{left:-10rem;} .introduction-conts.hearingaid .inConts .tabbox .button-next{right:-10rem;} .introduction-conts.hearingaid .inConts .tabbox .button-prev.swiper-button-disabled, .introduction-conts.hearingaid .inConts .tabbox .button-next.swiper-button-disabled{display:none;} .introduction-conts.hearingaid .inConts .tabbox .swiperbtn:before, .introduction-conts.hearingaid .inConts .tabbox .swiperbtn:after{content:""; position:absolute; top:50%; width:3rem; border-bottom:10px solid #222;} .introduction-conts.hearingaid .inConts .tabbox .swiperbtn:after{margin-top:-0.6rem;} .introduction-conts.hearingaid .inConts .tabbox .button-prev:before, .introduction-conts.hearingaid .inConts .tabbox .button-prev:after{left:3.5rem; transform-origin:left center;} .introduction-conts.hearingaid .inConts .tabbox .button-next:before, .introduction-conts.hearingaid .inConts .tabbox .button-next:after{right:3.5rem; transform-origin:right center;} .introduction-conts.hearingaid .inConts .tabbox .button-prev:before{transform:rotate(-45deg)} .introduction-conts.hearingaid .inConts .tabbox .button-prev:after{transform:rotate(45deg)} .introduction-conts.hearingaid .inConts .tabbox .button-next:before{transform:rotate(45deg)} .introduction-conts.hearingaid .inConts .tabbox .button-next:after{transform:rotate(-45deg)} .area-hearingaid02 .inConts .area-box01 .tabbox{padding-bottom:7rem; border-bottom:1px solid #ddd;} .area-hearingaid02 .inConts .area-box01 .tabbox .imgbox{display:flex; justify-content:center;} .area-hearingaid02 .inConts .area-box01 .tabbox .imgbox:first-child{margin-bottom:2rem;} .area-hearingaid02 .inConts .area-box01 .tabbox .imgbox div{margin:0 2rem;} .area-hearingaid02 .inConts .area-box01 .tabbox .textbox{margin-top:5rem; text-align:center;} .area-hearingaid02 .inConts .area-box01 .tabbox .textbox div img{max-width:150px;} .area-hearingaid02 .inConts .area-box01 .tabbox .textbox p{margin-top:3rem; font-size:1.8rem; font-weight:300; color:#666;} .area-hearingaid02 .inConts .area-box01 .tabbox .textbox p strong{color:#333;} .area-hearingaid02 .inConts .area-box02{padding:7rem 0;} .area-hearingaid02 .inConts .area-box02 .imgbox{padding:5rem 0;} .area-hearingaid02 .inConts .area-box02 .imgbox .box{margin-bottom:3rem; padding:5rem 0; box-shadow:0 0 10px #eee;} .area-hearingaid02 .inConts .area-box02 .imgbox .box h2{font-size:3rem; font-weight:600; color:#333; text-align:center;} .area-hearingaid02 .inConts .area-box02 .imgbox .box .img{display:flex; margin-top:5rem;} .area-hearingaid02 .inConts .area-box02 .imgbox .box .img div{width:50%;} .area-hearingaid02 .inConts .area-box02 .imgbox .box .img div:nth-child(1){padding-right:9rem; text-align:right;} .area-hearingaid03 .inConts{text-align:center;} .introduction-conts.hearingaid .area-hearingaid04 .inConts{padding-bottom:11rem;} .area-hearingaid05 .inConts .imgbox{height:34rem; padding-top:4rem; text-align:center; background:url(../img/sub/img_hearinga_diagnosis01.jpg) no-repeat center / cover;} .area-hearingaid05 .inConts .imgbox .textbox{display:inline-block; position:relative; width:83rem; height:30rem; padding-top:9rem; border:1rem solid #fff; border-bottom:none;} .area-hearingaid05 .inConts .imgbox .textbox:before{content:""; position:absolute; bottom:-5rem; right:-1rem; height:5rem; border-right:1rem solid #d2b472;} .area-hearingaid05 .inConts .imgbox .textbox:after{content:""; position:absolute; bottom:-5rem; right:-1rem; width:41.5rem; border-bottom:1rem solid #d2b472;} .area-hearingaid05 .inConts .imgbox .textbox h2{font-size:2.4rem; font-weight:700; color:#fff;} .area-hearingaid05 .inConts .imgbox .textbox p{margin-top:3rem; font-size:2rem; color:#fff;} .area-hearingaid05 .inConts .hearingalist{margin-top:12rem;} .area-hearingaid05 .inConts .hearingalist .text{margin-bottom:5rem;} .area-hearingaid05 .inConts .hearingalist .text div{position:relative; margin-bottom:2rem; padding:0 0 2rem 1.4rem; font-size:2rem; font-weight:700; color:#222; border-bottom:1px solid #222;} .area-hearingaid05 .inConts .hearingalist .text div:before{content:""; position:absolute; top:1rem; left:0; height:15px; border-left:4px solid #cca855;} .area-hearingaid05 .inConts .hearingalist .text p{font-size:1.6rem; font-weight:300; color:#666; line-height:2.4rem;} .area-hearingaid05 .inConts .hearingalist .text p span{margin-right:2rem;} .area-hearingaid05 .inConts .hearingalist .text:last-child div{color:#cca855;} .area-hearingaid05 .inConts .largebox{display:flex; justify-content:space-between;} .area-hearingaid05 .inConts .largebox .box{display:flex; width:58rem; border:1px solid #cca855;} .area-hearingaid05 .inConts .largebox .box .img{width:26rem;} .area-hearingaid05 .inConts .largebox .box .basic{width:calc(100% - 26rem);} .area-hearingaid05 .inConts .largebox .box .basic table th{padding:4rem 0 2rem 4rem; font-size:2rem; font-weight:700; color:#999; text-align:left; line-height:normal;} .area-hearingaid05 .inConts .largebox .box .basic table td{padding:0 0 1rem 4rem; font-size:1.6rem; color:#666; line-height:normal;} .area-hearingaid05 .inConts .largebox .box2 .basic table th{color:#222;} .area-hearingaid05 .inConts .largebox .box .basic table td:last-child{font-weight:300;} .area-hearingaid05 .inConts .largebox .box .basic table td.color{font-weight:700; color:#cca855;} .area-hearingaid06 .pageTop h4{margin-top:4rem; font-size:1.8rem; color:#666;} .area-hearingaid06 .process1{background:#f8f8f8;} .area-hearingaid06 .process{padding:11rem 0; text-align:center;} .area-hearingaid06 .process2{padding:11rem 0 7rem;} .area-hearingaid06 .process .inConts h2{font-size:2.6rem; color:#333;} .area-hearingaid06 .process .inConts .processlist{display:flex; margin-top:7rem;} .area-hearingaid06 .process .inConts .processlist .box{position:relative; width:25%;} .area-hearingaid06 .process2 .inConts .processlist .box{width:20%;} .area-hearingaid06 .process .inConts .processlist.flex .box{width:auto; flex:1;} .area-hearingaid06 .process .inConts .processlist .box .day{position:absolute; top:50%; right:-1rem; transform:translateY(-5rem); margin-bottom:3rem; font-size:1.6rem; font-weight:500; color:#111;} .area-hearingaid06 .process .inConts .processlist .box .img{padding-bottom:2rem;} .area-hearingaid06 .process .inConts .processlist .box .img div{display:table; width:100%; height:80px;} .area-hearingaid06 .process .inConts .processlist .box .img div span{display:table-cell; vertical-align:middle;} .area-hearingaid06 .process .inConts .processlist .box .img p{margin-top:1rem; font-size:1.6rem; font-weight:600; color:#d2b472;} .area-hearingaid06 .process .inConts .processlist .box .text{position:relative; border-top:4px solid #ddd;} .area-hearingaid06 .process .inConts .processlist .box .text:before{content:""; position:absolute; top:-3px; right:0; transform:rotate(45deg); width:15px; height:4px; margin-top:-5px; border-radius:5px; background:#ddd;} .area-hearingaid06 .process .inConts .processlist .box .text:after{content:""; position:absolute; top:-3px; right:0; transform:rotate(-45deg); width:15px; height:4px; margin-top:3px; border-radius:5px; background:#ddd;} .area-hearingaid06 .process .inConts .processlist .box:last-child .text:before{display:none;} .area-hearingaid06 .process .inConts .processlist .box:last-child .text:after{width:10px; height:10px; margin-top:-4px; border-radius:50%;} .area-hearingaid06 .process .inConts .processlist .box .text p{margin-bottom:1rem; font-size:1.6rem; color:#666;} .area-hearingaid06 .process .inConts .processlist .box .text p:nth-of-type(1){position:relative; padding-top:3rem;} .area-hearingaid06 .process .inConts .processlist .box .text p:nth-of-type(1):before{content:""; position:absolute; top:-13px; left:50%; transform:translateX(-50%); width:21px; height:21px; border:5px solid #d2b472; border-radius:50%; background:#fff;} .area-hearingaid06 .process .inConts .processlist .box .text p strong{font-size:2rem; color:#333;} .area-hearingaid06 .process3 .inConts{padding-bottom:11rem;} .area-hearingaid06 .process3 .inConts .textbox{padding:5rem; border:1px solid #ddd; border-radius:5px;} .area-hearingaid06 .process3 .inConts .textbox ul li{position:relative; margin-bottom:2rem; padding-left:3.2rem; font-size:1.6rem; color:#666;} .area-hearingaid06 .process3 .inConts .textbox ul li:last-child{margin-bottom:0;} .area-hearingaid06 .process3 .inConts .textbox ul li span{display:block; position:absolute; top:5px; left:0; width:22px; height:22px; font-size:1.4rem; color:#fff; text-align:center; line-height:22px; border-radius:50%; background:#d2b472;} .area-hearingaid06 .process3 .inConts .textbox ul li strong{color:#333;} .area-hearingaid06 .process3 .inConts .textbox ul li .red{font-weight:400; color:#ec2739;} .area-hearingaid06 .process4{height:32rem; background:url(../img/sub/img_hearingaid06_bg.jpg) no-repeat center / cover;} .area-hearingaid06 .process4 .inConts{padding-top:7rem;} .area-hearingaid06 .process4 .inConts h2 span{font-size:2rem; font-weight:700; color:#333; line-height:3.4rem;} .area-hearingaid06 .process4 .inConts h2 strong{font-size:2.4rem;} .area-hearingaid06 .process4 .inConts p{margin-top:1rem; font-size:1.8rem; color:#333;} .area-hearingaid06 .process5 .inConts{padding:6rem 0 0;} .area-hearingaid06 .process5 .inConts .textbox div{position:relative; padding:0 0 2rem 1.4rem; font-size:2rem; font-weight:700; color:#222; border-bottom:1px solid #222;} .area-hearingaid06 .process5 .inConts .textbox div:before{content:""; position:absolute; top:10px; left:0; height:15px; border-left:4px solid #cca855;} .area-hearingaid06 .process5 .inConts .textbox ul{margin-top:2rem;} .area-hearingaid06 .process5 .inConts .textbox ul li{display:inline-block; position:relative; width:48rem; margin-bottom:1rem; padding-left:3.5rem; font-size:1.7rem; font-weight:300; color:#333;} .area-hearingaid06 .process5 .inConts .textbox p{margin-top:1rem; font-size:1.5rem; font-weight:300; color:#666;} .area-hearingaid06 .process5 .inConts .textbox ul li span{position:absolute; top:5px; left:0; width:22px; height:22px; font-size:1.4rem; color:#fff; text-align:center; line-height:25px; border-radius:50%; background:#cca855;} .area-hearingaid06 .process5 .inConts .processlist{display:flex; justify-content:space-between; margin-top:6rem;} .area-hearingaid06 .process5 .inConts .processlist .box{width:58rem; padding-bottom:6rem; border:1px solid #ddd; border-radius:5px; overflow:hidden;} .area-hearingaid06 .process5 .inConts .processlist .box>p{padding:2rem 0; font-size:1.8rem; color:#333; text-align:center; background:#f5f7fc;} .area-hearingaid06 .process5 .inConts .processlist .box .round{margin:4rem 0 3rem;} .area-hearingaid06 .process5 .inConts .processlist .box .round div{display:table; width:170px; height:170px; margin:0 auto; text-align:center; border-radius:50%; background:#c2a157;} .area-hearingaid06 .process5 .inConts .processlist .box .round div span{display:table-cell; vertical-align:middle; font-size:2.1rem; color:#fff; line-height:2.4rem;} .area-hearingaid06 .process5 .inConts .processlist .box .barbox .won{display:flex;} .area-hearingaid06 .process5 .inConts .processlist .box .barbox .won div{width:50%; font-size:1.7rem; color:#333;} .area-hearingaid06 .process5 .inConts .processlist .box .barbox .won div:last-child{text-align:right;} .area-hearingaid06 .process5 .inConts .processlist .box .barbox strong.color{font-weight:300;color:#ae8a39;} .area-hearingaid06 .process5 .inConts .processlist .box .barbox{padding:0 2rem;} .area-hearingaid06 .process5 .inConts .processlist .box .barbox .bar{display:flex; margin:1rem 0; border-radius:5px; overflow:hidden;} .area-hearingaid06 .process5 .inConts .processlist .box .barbox .bar div{padding:1rem 2rem; font-size:1.6rem; font-weight:300; color:#fff; background:#bab8b5;} .area-hearingaid06 .process5 .inConts .processlist .box .barbox .bar div:first-child{width:60%;} .area-hearingaid06 .process5 .inConts .processlist .box .barbox .bar div:last-child{width:40%; text-align:right; background:#c2a055;} .area-hearingaid06 .process5 .inConts .processlist .box2 .barbox .won div:first-child, .area-hearingaid06 .process5 .inConts .processlist .box2 .barbox .bar div:first-child{width:100%; text-align:center;} .area-hearingaid06 .process5 .inConts .processlist .box .barbox p{margin-top:3rem; font-size:1.6rem; font-weight:300; color:#666; text-align:center;} .area-hearingaid06 .process5 .inConts .processlist .box .barbox p strong{display:inline-block; margin-left:1rem; padding-left:1rem; line-height:1.3rem; border-left:1px solid #ae8a39;} .area-hearingaid06 .process5 .inConts .text{margin-top:6rem; font-size:1.8rem; color:#666;} #container .introduction-conts.hearingaid .area-hearingaid07 .inConts{padding-bottom:11rem;} .area-hardtocall .area-box .inConts .linkbox{display:block; height:20.5rem; margin-bottom:3rem; padding:5rem 7rem; border-radius:1rem; background:#f8f8f8;} .area-hardtocall .area-box .inConts .linkbox .box{display:flex; position:relative;} .area-hardtocall .area-box .inConts .linkbox .box:before{content:""; position:absolute; top:50%; right:0; transform:rotate(45deg); width:15px; height:4px; margin-top:-5px; border-radius:5px; background:#222;} .area-hardtocall .area-box .inConts .linkbox .box:after{content:""; position:absolute; top:50%; right:0; transform:rotate(-45deg); width:15px; height:4px; margin-top:3px; border-radius:5px; background:#222;} .area-hardtocall .area-box .inConts .linkbox .box div:first-child{margin-right:3rem;} .area-hardtocall .area-box .inConts .linkbox .box div p:nth-of-type(1){font-size:2.6rem; font-weight:300; color:#222;} .area-hardtocall .area-box .inConts .linkbox .box div p:nth-of-type(2){margin-top:1rem; font-size:1.8rem; font-weight:300; color:#333;} .area-hardtocall .area-box .inConts .linkbox.catalk{background:#cca855;} .area-hardtocall .area-box .inConts .linkbox.catalk .box div p:nth-of-type(1), .area-hardtocall .area-box .inConts .linkbox.catalk .box div p:nth-of-type(2){color:#fff;} .area-hardtocall .area-box .inConts .linkbox.catalk .box:before, .area-hardtocall .area-box .inConts .linkbox.catalk .box:after{background:#fff;} .process7{padding-bottom:0 !important;} .process7 .inConts{padding:0 2rem !important;} .process7-area{margin-top:7rem;} .process7-area.no{width:100% !important; margin-top:5rem;} .process7-area>ol{text-align: left;} .process7-area>ol>li{position:relative; padding-left:1.4rem; font-size:1.6rem; color:#666;} .process7-area>ol>li+li{margin-top:2rem;} .process7-area>ol>li>span{font-size:0; line-height:0; position:absolute; top:0.5rem; left:0; height:1.5rem; border-left:4px solid #cca855;} /*.process7-area>ol>li>span{display:block; position:absolute; top:2px; left:0; width:22px; height:22px; font-size:14px; color:#fff; text-align:center; line-height:22px; border-radius:50%; background:#d2b472;}*/ .process7-area>ol>li strong, .process7-area>ol>li>p{font-weight: 600; color:#333;} .process7-area>ol>li>strong{margin-bottom:0.5rem; display:block;} .process7-area>ol>li>p{margin-top:2rem;} .process7-area .last{margin:7rem 0 1rem; font-weight: bold; font-size:2.4rem; text-align: center;} .process7-area .last+div{font-size:2rem; color: #333; text-align: center;} .process7-area .last+div>strong{text-decoration:none; display: inline; box-shadow: inset 0 -0.9rem 0 rgba(194,160,85,0.4);} .process7-area>ol>li>ol{margin-top:0.7rem;} .process7-area ol.nom>li, .process7-area>ol>li>ol>li{position:relative; padding-left:2.1rem;} .process7-area ol.nom>li>i, .process7-area>ol>li>ol>li>i{font-style: normal;position:absolute; top:0; left:0;display:block;} .process7-area>ol>li>dl{margin-top:1rem; display:flex; align-items: flex-start;} .process7-area>ol>li>dl>dt{width:6.4rem;} .process7-area>ol>li>dl>dt>span{width:5.4rem; height:2.7rem; background-color: #666; font-weight: 500; font-size:13px; line-height:1; color: #fff; text-align: center; display: flex; align-items: center; justify-content: center; border-radius:5px} .process7-area>ol>li>dl>dd{width:calc(100% - 6.4rem);} .process7-area ul.bul{} .process7-area ul.bul>li{font-size:1.6rem; line-height:2.8rem; color: #666;} /* HISTORY */ .historyArea{font-size:0; line-height:0; position: relative;} .historyArea:before{content: ""; width: 0.6rem; margin-left:-0.3rem; background-color: rgba(221,221,221,0.8); display: inline-block; position:absolute; left: 50%; top:1.5rem; bottom:10rem;} .historyArea>li{text-align: right; position: relative; z-index:2;} .historyArea .txt_wrap{width:50%; padding:0 4rem; text-align: left; display:inline-block; vertical-align: top; box-sizing: border-box; position: relative;} .historyArea .txt_wrap:before{content: ""; width: 2.4rem; height:2.4rem; background-color:#333; border:4px solid #fff; display: inline-block; position:absolute; left: -1.2rem; top:1rem; border-radius:999px; box-sizing: border-box;} .historyArea .txt_wrap>strong{font-weight: 500; font-size:3.6rem; line-height:1; color: #333; display:block;} .historyArea .txt_wrap>ul{margin:2rem 0 4rem;} .historyArea .txt_wrap>ul>li{margin-top:1rem; padding-left:1.2rem; font-size:1.6rem; line-height:1.6; color: #666; position: relative;} .historyArea .txt_wrap>ul>li:before{content: "-"; position:absolute; left: 0; top:0px;} .historyArea>li:nth-child(even){text-align: left;} .historyArea>li:nth-child(even) .txt_wrap{text-align: right;} .historyArea>li:nth-child(even) .txt_wrap:before{left:auto; right: -1.2rem;} .historyArea>li:nth-child(even) .txt_wrap>ul>li{padding:0 1.2rem 0 0;} .historyArea>li:nth-child(even) .txt_wrap>ul>li:before{left:auto; right:0;} .historyArea.month .txt_wrap>ul>li{padding-left:4.3rem;} .historyArea.month .txt_wrap>ul>li:before{content: attr(data-month)"월"; color: #333;} .historyArea.month>li:nth-child(even) .txt_wrap>ul>li{padding:0 4.3rem 0 0;} .historyArea.admin .txt_wrap>ul>li{padding:0 3rem !important;} .historyArea.admin .txt_wrap>ul>li:before{display:none;} .historyArea.admin .txt_wrap>ul>li .checkIn.noTxt{position: absolute; left:0; top:0rem;} .historyArea.admin>li:nth-child(even) .txt_wrap>ul>li .checkIn.noTxt{left:auto; right:0;} .etc_clause{width:90%; margin:0 auto; padding:60px 80px 80px; background-color: #fdfdfd; border:1px solid #cecece; font-size:0; line-height:0; text-align: center; box-sizing:border-box; border-radius:10px; position: relative;} .etc_clause:before, .etc_clause:after{content:"";position:absolute;z-index:-1;top:2%;bottom:0;left:10px;right:10px;-webkit-box-shadow:0 0 20px rgba(0,0,0,0.8); -moz-box-shadow:0 0 20px rgba(0,0,0,0.8); box-shadow:0 0 20px rgba(0,0,0,0.8);-moz-border-radius:100px / 10px; border-radius:100px / 10px;} .etc_clause:after{right:10px;left:auto;-webkit-transform:skew(8deg) rotate(3deg);-moz-transform:skew(8deg) rotate(3deg);-ms-transform:skew(8deg) rotate(3deg);-o-transform:skew(8deg) rotate(3deg);transform:skew(8deg) rotate(3deg);} .etc_clause .logo{margin:0;} .etc_clause .logo img{} .etc_clause .txt{padding:15px 0 55px; font-weight: 300; font-size:18px; line-height:1; color: #636363;} .etc_clause .txt>span{font-weight: 400; color: #1b1b1b;} .etc_clause .scroll{font-weight:300; font-size:16px; line-height:1.8; color: #626262; text-align: left;} .etc_select{width:90%; margin:0 auto 2rem;} .etc_select select.base{width:17rem;} /*[e] Sub Style */ /*[s] Plugin Style */ /* Layer Style */ /*.layerArea .layerIn .layerBgIn{width:0px; height:0px; background-color: rgba(255,255,255,0.7); position:absolute; left:50%; top:50%; z-index:100; -webkit-transition: .5s; transition: .5s; transform-origin: 50% 50%;}*/ .layerCell{display:none;} .layerArea{width:0px; height:0px; background-color: rgba(0,0,0,0.7); position:fixed; left:50%; top:50%; z-index:99; overflow:hidden; overflow-y:auto; -webkit-transition: .5s; transition: .5s; transform-origin: 50% 50%;} .layerArea.one, .layerArea.two{width:100%; height:100%; left:0%; top:0%;} .layerArea.two .layerBgIn{width:100%; height:100%; left:0%; top:0%;} .layerArea .closeLy{width:1.7rem; height:1.7rem; display:inline-block; position: absolute; right:0; top:0;} .layerArea .closeLy:before, .layerArea .closeLy:after{content: ""; background-color: #080808; position: absolute; left:50%; top:50%;} .layerArea .closeLy:before{width: 100%; height: 2px; transform:translate(-50%, -50%) rotate(45deg);} .layerArea .closeLy:after{width: 2px; height: 100%; transform:translate(-50%, -50%) rotate(45deg);} .layerArea .closeLy.type02{width:2.3rem; height:2.3rem; right:3rem; top:3rem;} .layerArea .closeLy.type02:before, .layerArea .closeLy.type02:after{background-color: #676767;} .layerArea .layerIn{width:100%; height:100%; display: table; position:relative;} .layerArea .layerIn .layerCell{width:100%; height:100%; padding:70px 0; display: table-cell; vertical-align:middle; position:relative; box-sizing: border-box;} .layerArea .layerIn .layerBox{margin:0 auto; background-color: #fff; font-size:0; line-height:0; display:none; position: relative; box-sizing: border-box; z-index:99; border-radius:1rem;} /* .layerArea .layerIn .layerBox>.tit_lay{padding:25px 25px 15px;} .layerArea .layerIn .layerBox>.tit_lay>strong{font-size:16px; line-height:1; color:#00a9cc;} */ .layerArea .layerIn .layerBox .contLy{position: relative;} .downlay{width:100%; padding:10rem 0; border-radius:0 !important;} .downlay .closeLy{top:-5rem;} .downlay>.contLy{width:64.5rem; margin:0 auto; text-align: center;} .downlay .title{padding-bottom:5rem; font-weight: bold; font-size:3rem; line-height:1; color: #000;} .downlay .title>strong{color: #23abaf;} .downlay .utllBox{width:47.6rem; margin:0 auto; display:table; table-layout: fixed;} .downlay .utllBox>*{width:50%; display:table-cell; vertical-align: top; box-sizing: border-box;} .downlay .utllBox .tit{font-size:1.5rem; line-height:1; color: #666;} .downlay .utllBox .txt{margin-top:2.5rem; font-size:1.2rem; line-height:1; color: #888;} .downlay .utllBox .icon{height:15rem; margin-top:3rem; display: flex; flex-wrap: wrap; flex-direction: row; align-content: center; justify-content: center;} .downlay .utllBox .icon>p+p{margin-top:2rem;} .downlay .utllBox>.qr{border-left:1px solid #dadada;} .downlay .utllBox>.store img{width:16.8rem;} .downlay .utllBox>.qr img{width:15rem;} .formLay{width:62rem; padding:7rem 5rem 6rem; border-radius:1rem;} .formLay input[type=text]{width:100%; height:5.4rem; padding:0; background-color:#fff; border-bottom:2px solid #e8e8e8; font-size:1.8rem; line-height:5.2rem; color:#666; box-sizing: border-box; vertical-align:middle; display:inline-block;} .formLay .title{padding-bottom:3.5rem; border-bottom:1px solid #333; font-weight: 500; font-size:2.6rem; line-height:1; color: #1b1b1b;} .formLay .textBox{width:62rem; margin:-1px 0 0 -5rem; padding:4rem 0; background-color: #f6f7fa; border-top:1px solid #ececec; border-bottom:1px solid #ececec; font-size:1.9rem; line-height:1; color: #1b1b1b; letter-spacing: -0.08em; text-align: center; position: relative; z-index:2;} .formLay .textBox>span{color: #149699;} .formLay .launchingForm{margin-top:1rem;} .formLay .launchingForm>li{padding-top:4rem;} .formLay .launchingForm>li>dl{} .formLay .launchingForm>li>dl>dt{font-weight: 500; font-size:1.9rem; line-height:1; color: #1b1b1b;} .formLay .launchingForm>li>dl>dd{height:6.4rem; padding-top:1rem; display: flex; flex-wrap: wrap; flex-direction: row; align-items: center; justify-content: flex-start; box-sizing: border-box;} .formLay .launchingForm>li>dl>dd.two{flex-wrap: nowrap; justify-content: space-between; white-space: nowrap;} .formLay .launchingForm>li>dl .checkIn{} .formLay .launchingForm>li.two{display: flex; justify-content: space-between;} .formLay .launchingForm>li.two>dl{width:48%;} .formLay .launchingForm>li .clauseView{font-size:1.7rem; line-height:1; color: #989898;display:inline-block;} .formLay .launchingForm>li .clauseView>span{border-bottom:1px solid #999; padding:0.2rem 0 0.3rem; display:inline-block;} .formLay .btnArea{margin-top:6rem;} .privacylay{width:62rem; padding:7rem 5rem;} .privacylay .title{padding-bottom:3.5rem; font-weight: 500; font-size:2.8rem; line-height:1; color: #000; text-align: center;} .privacylay .clauseArea .scroll{padding:3.5rem 3.9rem; background-color: #f8f9fb; border:1px solid #eee; font-weight: 300; font-size:1.7rem; line-height:2.6rem; color: #666;} /* Img Over Bg Style */ #photo{width:960px;margin:0 auto; position:relative; overflow:hidden;} #photo>li{width:150px; height:150px; margin:5px; float:left; display:inline; overflow:hidden; } #photo>li>a{width:100%; height:100%; position: relative; display:block; overflow:hidden;} #photo>li>a>img{width:100%; height:100%; display:block; border-radius:5px;} #photo>li>a>.bg_l{width:100%; height:100%; background-color:red; position: absolute; left:0; top:0; display:none; opacity:0.3; border-radius:5px;} /* Notice One Line Style */ .mNoticeList{width:100%; height:60px; margin-top:25px; overflow:hidden; position: relative;} .mNoticeList>ul{width:100%; position: absolute; left:0; top:-60px;} .mNoticeList>ul>li{height:60px; position: relative;} .mNoticeList>ul>li>a{padding-left:73px; display:block; position: relative;} .mNoticeList .day{width:41px; padding-right:15px; border-right:1px solid #d5d1cc; font-weight: 600; font-size:12px; line-height:1; color: #b99764; text-align: center; position: absolute; left:0; top:0;} .mNoticeList .day>strong{font-weight: 700; font-size:32px; line-height:1; display:block;} .mNoticeList dl.list{font-size:16px; line-height:20px; color: #876e49; word-break:keep-all; word-wrap:break-word;} .mNoticeList dl.list>dt{padding-bottom:6px; font-weight: 600; font-size:12px; line-height:1; color: #b99764;} /*[e] Plugin Style */ @media only screen and (max-width : 1600px){ /*[s] Main Style */ /*[e] Main Style */ } @media only screen and (max-width : 1440px){ /*[s] Main Style */ #mVisual .vTxtArea{padding:0 2rem;} .introduction-conts.hearingaid .inConts .tabbox .button-prev{left:0rem;} .introduction-conts.hearingaid .inConts .tabbox .button-next{right:0rem;} /*[e] Main Style */ } @media only screen and (max-width : 1320px){ /*[s] Main Style */ /* 창업문의 */ #startup_inquiry .startup_info>dl{padding:0 2rem;} /*[e] Main Style */ /*[s] Sub Style */ /*[e] Sub Style */ } @media only screen and (max-width : 1280px){ } @media only screen and (max-width : 1240px){ .scroll_info{display:block;} .scrollTb{width:100%; display:block; overflow:hidden; overflow-x:scroll;} .scrollTb>*{width:1200px !important;} /*[s] Main Style */ /* 창업문의 */ #startup_inquiry .startup_info>dl{padding:0 1rem;} /*[e] Main Style */ /*[s] Sub Style */ .stackArea .stack_re>.textBox{padding-right:4rem;} .stackArea .stack_re:nth-child(even)>.textBox{padding:0 0 0 4rem;} /*[e] Sub Style */ } @media only screen and (max-width : 1200px){ .scroll_info{display:block;} .scrollTb{width:100%; display:block; overflow:hidden; overflow-x:scroll;} .scrollTb>*{width:1200px;} .introduction-conts .area-people .thumb .profile .list .imgbox .rbox { width: 50%; max-width: 37rem;} /*[s] Sub Style */ /*[e] Sub Style */ } @media only screen and (max-width : 1024px){ /*[s] All Style */ .depth3{margin-bottom:6rem; display: flex; justify-content: space-between;} .depth3:before{display:none;} .depth3>a{width:100%; height:auto; padding:1rem 2rem;} .depth3>a+a{margin-left:-1px;} .depth3>a>span:before{display:none;} /*[e] All Style */ /*[s] Main Popup Style */ .hd_pops{position: absolute; left:2rem !important; top:2rem !important;} .hd_pops_con{width:auto !important;} /*[e] Main Popup Style */ /*[s] Main Style */ /* visual */ #mVisual .visualRoll .slider img{} #mVisual .slick-arrow{display:none !important;} #mVisual .slick-dots{display:block !important;} /* 메뉴 소개 */ #menu_introduction{padding:12rem 0 12rem;} #menu_introduction:before{ width: 100%; height: 62%;} #menu_introduction .inConts{display: block;} #menu_introduction .inConts .mTitle{width:100%; margin-bottom:6rem; text-align:center;} #menu_introduction .inConts .mTitle>dt{background-position: center bottom;} #menu_introduction .inConts .photo_list{width:100%;} #menu_introduction .slickArr{margin-top:0; position: static;} #menu_introduction .slick-arrow{background-color: #fff; border-color:#7cb640; color: #7cb640; position: absolute; top:66%; transform: translateY(-50%); z-index:7;} #menu_introduction .slick-prev{left:2rem;} #menu_introduction .slick-next{margin-left:0; right:2rem;} /* 메뉴 갤러리 */ #menu_gallery .swiper-button{font-size:0; line-height:0;} /* 창업문의 */ #startup_inquiry{padding:12rem 0; background-position: -16rem 10rem;} #startup_inquiry .startup_info{margin-bottom:6rem; justify-content: space-between;} #startup_inquiry .startup_info>dl{width:31%; padding:0rem;} #startup_inquiry .startup_info>dl>dt{} #startup_inquiry .startup_info>dl>dt>span{} #startup_inquiry .startup_info>dl>dd{width:100%; min-width:auto; min-height:14rem; padding:0; border-radius:5px;} #startup_inquiry .startup_map{padding:5.5rem 2rem 8rem; background-color: #fff; display: block;} #startup_inquiry .startup_map .img{display:none;} #startup_inquiry .startup_map .store{width:100%;} /*[e] Main Style */ /*[s] Sub Style */ .introduction-conts .area-ceo{font-size:2.5rem; line-height:3.5rem;} .introduction-conts .area-people .thumb .tab li{width:15%; margin:0 1%;} .introduction-conts .area-people .thumb .profile .list .imgbox{display:block; height:auto;} .introduction-conts .area-people .thumb .profile .list .imgbox .rbox{width:100%; max-width: none;} .introduction-conts .area-people .thumb .profile .list .imgbox .rbox .img{position:static; margin-bottom:3rem;} .introduction-conts .area-people .thumb .profile .list .imgbox .rbox .img img{width:100%;} .introduction-conts .area-direction .add .box>div:nth-child(1){width:12rem;} .introduction-conts .area-direction .add .box>div:nth-child(2){width:calc(100% - 12rem);} .introduction-conts .area-people .thumb .tab {gap: 1rem;} .introduction-conts .area-people .thumb .tab li{width: calc((100% - 3rem)/4);margin: 0;margin-bottom:2rem;} .introduction-conts .area-people .thumb .tab li a div{max-width: 160px; height: auto; width: 100%;} .introduction-conts.advantage .profile{padding:8rem 2rem;} .introduction-conts.advantage .profile .list .imgbox .rbox h2{font-size:4rem; line-height:normal;} .introduction-conts.advantage .profile .list .imgbox .rbox h3{font-size:3rem;} .introduction-conts.advantage .profile .list .imgbox .rbox ul li{font-size:2.5rem;} .introduction-conts.advantage .profile .list .text div strong{font-size:3rem;} .introduction-conts.advantage .profile .list .text ul li{margin-bottom:1rem; font-size:2.5rem; line-height:nomal;} .introduction-conts .area-advantage04 .inConts .area-box ul{padding:0 2rem;} .introduction-conts .inConts .imgbox3 div{width:30%;} .introduction-conts .area-advantage10 .inConts .imgbox3, .introduction-conts .area-advantage13 .inConts .imgbox3{gap:0 2rem;} .introduction-conts .area-advantage10 .inConts .imgbox3 div, .introduction-conts .area-advantage13 .inConts .imgbox3 div{width:100%; margin:0 ;} .introduction-conts .area-advantage13 .inConts .imgbox3 div{max-width:300px;} .introduction-conts.advantage .profile .profile_list .imgbox{display:block; height:auto;} .introduction-conts.advantage .profile .profile_list .imgbox .rbox{width:100%;} .introduction-conts.advantage .profile .profile_list .imgbox .rbox .img{position:static; margin-bottom:5rem;} .introduction-conts.advantage .profile .profile_list .imgbox .rbox .img img{width:100%;} .introduction-conts .area-advantage15:before{background-position:left center;} .introduction-conts.hearingaid .area-hearingaid01 .area-box .inConts, .introduction-conts.hearingaid .area-hearingaid02 .inConts, .introduction-conts.hearingaid .area-hearingaid03 .inConts, .introduction-conts.hearingaid .area-hearingaid04 .inConts, .introduction-conts.hearingaid .area-hearingaid05 .inConts{padding:0 2rem;} .introduction-conts.hearingaid .area-hearingaid02 .inConts .area-box02 .imgbox .box{padding:5rem 2rem;} .introduction-conts.hearingaid .area-hearingaid06 .process4 .inConts{padding:7rem 2rem 0;} .introduction-conts.hearingaid .area-hearingaid06 .process5 .inConts{padding:6rem 2rem 0;} .introduction-conts.hearingaid .area-hearingaid06 .process5 .inConts .processlist .box{width:49%;} .introduction-conts.hearingaid .area-hearingaid07 .inConts{padding:0 2rem 11rem;} .introduction-conts.hearingaid .inConts .tabbox .swiperbtn{} .introduction-conts.hearingaid .inConts .tabbox .button-prev{left:10rem;} .introduction-conts.hearingaid .inConts .tabbox .button-next{right:10rem;} .area-hardtocall .area-box .inConts .linkbox .box div img{width:100px;} /*[e] Sub Style */ .process7-area{/*width:calc(100% - 4rem);*/ margin:7rem auto 0;} } @media only screen and (max-width : 840px){ /*[s] All Style */ .nTable{} .nTable>table{} .nTable>table th, .nTable>table td{padding:3rem; font-size:2.2rem; line-height:3.2rem;} .nTable>table th{height:8rem; padding:0; font-size:2.4rem;} .nTable>table ul.bul>li{font-size:2rem; line-height:1.6;} .nTable>table .transportation>li{padding-left:0;} .nTable>table .transportation>li>p{padding-bottom:1rem; font-size:2.2rem; line-height:1; position: relative;} .nTable>table .transportation>li>dl>dt>span{font-size:2rem; line-height:4rem;} .nTable>table .transportation>li>dl>dd .inT{font-size:2rem; line-height:4rem;} .nTable +.nTable{margin-top:4rem;} .tabDepth{margin-bottom:3rem;} .tabDepth>a{height:5.2rem; font-size:2rem;} .depth3>a{font-size:2rem; line-height:1.4;} .groupTit{padding-bottom:4rem;} .groupTit .step{font-size:2.4rem;} h4.txt{font-size:3rem;} .nTxt{font-size:2rem; line-height:2.8rem;} ul.bul{} ul.bul>li{padding-left:1.5rem; font-size:2rem;} ul.star{} ul.star>li{padding-left:2.9rem; font-size:2rem;} ul.etc{} ul.etc>li{padding-left:4rem; font-size:2rem;} h4.line{margin-bottom:4rem;} h4.line.mt{margin-top:6rem;} h5.bul{margin:6rem 0 3rem; padding-left:2.6rem; font-size:2.8rem;} h5.bul:before{width: 1.8rem; height: 1.8rem; border-width:0.4rem;} h5.bul .more{padding:1rem 1.5rem; font-size:1.8rem; top:-0.7rem;} .scrollTb>*{width:120rem;} .nTable.scrollTb>*{width:840px !important;} .introduceArea .scrollTb>*{width:111.8rem;} .admGo{font-size:0; line-height:0; position: relative; z-index:7;} .admGo>a{padding:0.625rem 1.25rem; background-color:#f00; font-size:1.25rem; line-height:1.2; color:#fff; display:inline-block; position:absolute; left:0; bottom:0;} .admGos{font-size:1.8rem;} .arrBtn{font-size:2rem; line-height:4.6rem;} .arrBtn>span{padding-right:60px;} select.base{height:5rem; background-size:4.3rem; font-size:2rem; line-height:4.8rem;} /*[e] All Style */ /*[s] Main Popup Style */ .hd_pops{left:2rem !important; right:2rem !important;} .hd_pops_con{} /*[e] Main Popup Style */ /*[s] Main Style */ #fullpage{background-color: rgba(0,0,0,0.3); text-align:left; font-size:0; line-height:0; position: relative; z-index:1;} #fullpage .fp-tableCell{padding-bottom:9rem;} #fullpage .section.fp-auto-height .fp-tableCell{padding-bottom:8.5rem;} #fullpage .section[data-anchor]{} #fullpage .section[data-anchor="first"]{background-position: 75% center;} #fullpage .section[data-anchor="second"]{} #fullpage .section[data-anchor="third"]{background-position: 55% center;} #fullpage p.title{padding-bottom:4.2rem; font-size:5rem;} #fullpage p.title:before{width: 6rem;} #fullpage p.tit{margin-top:5rem; font-size:3.6rem;} #fullpage p.txt{margin-top:3rem; font-size:2.8rem;} #fullpage p.btns{margin-top:7rem;} #fullpage p.btns>a{width:22rem; height:7rem; font-size:2.2rem;} #fullpage.y2025 .section[data-anchor="first"]{background-image: url("../img/main/bg_main001_m.jpg"); background-position: center center;} #fullpage.y2025 .section[data-anchor="second"]{background-image: url("../img/main/bg_main002_m.jpg?var=2026-04-14"); background-position: center top;} #fullpage.y2025 .section[data-anchor="second"] .fp-tableCell{padding-bottom:3rem; vertical-align: bottom;} #fullpage.y2025 .section[data-anchor="third"]{background-image: url("../img/main/bg_main003_m.jpg"); background-position: center center;} /*[e] Main Style */ /*[s] Sub Style */ /* HISTORY */ .historyArea{} .historyArea:before{margin-left:0; left: 0%;} .historyArea>li{} .historyArea .txt_wrap{width:100%; padding:0 0 0 4rem;} .historyArea .txt_wrap:before{width: 3rem; height:3rem; left: -1.2rem; top:0.5rem;} .historyArea .txt_wrap>strong{font-size:3.2rem;} .historyArea .txt_wrap>ul{} .historyArea .txt_wrap>ul>li{padding-left:1.2rem; font-size:2rem;} .historyArea>li:nth-child(even){text-align: left;} .historyArea>li:nth-child(even) .txt_wrap{text-align: left;} .historyArea>li:nth-child(even) .txt_wrap:before{left: -1.2rem; right:auto;} .historyArea>li:nth-child(even) .txt_wrap>ul>li{padding:0 0 0 1.2rem;} .historyArea>li:nth-child(even) .txt_wrap>ul>li:before{left:0; right:auto;} .historyArea.month .txt_wrap>ul>li{padding-left:5rem;} .historyArea.month .txt_wrap>ul>li:before{} .historyArea.month>li:nth-child(even) .txt_wrap>ul>li{padding:0 0 0 5rem;} .historyArea.admin .txt_wrap>ul>li{padding:0 5rem !important;} .historyArea.admin>li:nth-child(even) .txt_wrap>ul>li .checkIn.noTxt{left:0; right:auto;} .etc_clause{width:100%; margin:0 auto; padding:5rem 4rem; border-radius:1rem;} .etc_clause .logo{margin:0;} .etc_clause .txt{padding:2rem 0 6rem; font-size:2.2rem;} .etc_clause .scroll{font-size:2rem;} .etc_select{width:100%;} .etc_select select.base{width:22rem;} .newMedal .imgArea{width: 100%;} .newMedal .imgArea:nth-child(n + 4){width: 100%;} .introduction-conts .area-people .thumb .profile{padding:0 1rem;} .introduction-conts .area-people .thumb .profile .list .imgbox .rbox .img{position:static; margin-bottom:5rem;} .introduction-conts .area-people .thumb .profile .list .imgbox .rbox .img img{width:100%;} .introduction-conts .area-people .thumb .profile .list .imgbox{height:auto;} .introduction-conts .area-people .thumb .profile .list .imgbox .rbox h2{font-size:4rem; line-height:normal;} .introduction-conts .area-people .thumb .profile .list .imgbox .rbox h3{font-size:3rem;} .introduction-conts .area-people .thumb .profile .list .imgbox .rbox ul li, .introduction-conts .area-people .thumb .profile .list .text div strong, .introduction-conts .area-people .thumb .profile .list .text ul li{font-size:2.5rem;} .introduction-conts .area-review .more a{width:200px; height:50px; line-height:48px;} .introduction-conts .area-review .more a span{font-size:2.5rem;} .introduction-conts .area-gal>h1{font-size:4rem;} .introduction-conts .area-gal>p{font-size:2.5rem; line-height:3.5rem;} .introduction-conts .area-direction .map{height:35rem;} .introduction-conts .area-direction .add{padding:6rem 0;} .introduction-conts .area-direction .add .box{display:block;} .introduction-conts .area-direction .add .box div{font-size:3rem;} .introduction-conts .area-direction .add .box>div:nth-child(1){margin-bottom:2rem;} .introduction-conts .area-direction .add .box>div:nth-child(1), .introduction-conts .area-direction .add .box>div:nth-child(2){width:100%;} .introduction-conts .area-direction .add .box2 .bus div span{width:100%; display:block; margin-top:3rem; line-height:4rem;} .introduction-conts .area-direction .add .box2 .bus div strong{width:100px; height:40px; line-height:40px;} .introduction-conts .area-online{padding-top:8rem;} .introduction-conts .area-online h1{font-size:3.5rem;} .introduction-conts .area-online p{font-size:2.5rem;} .introduction-conts .area-online .more a{width:180px; height:50px; font-size:2.5rem; line-height:50px;} .introduction-conts.advantage>div{padding:0 1rem;} .introduction-conts.advantage>div.area-gene{padding: 0 0 15rem;} .introduction-conts .area-advantage01 .inConts div{} .introduction-conts .area-advantage02 .inConts .area-box>p span, .introduction-conts .area-advantage02 .inConts .area-box .img2 div p, .introduction-conts .area-advantage03 .inConts>p, .introduction-conts .area-advantage03 .inConts .area-box .sbox div ul li, .introduction-conts .inConts .list .text strong, .introduction-conts .inConts .list .sbox .box>p, .introduction-conts .inConts .list .sbox .box div p, .introduction-conts .inConts .list .sbox .box ul li, .introduction-conts.advantage .profile .profile_list .imgbox .rbox ul li, .introduction-conts.advantage .profile .profile_list .text ul li, .introduction-conts .area-advantage17 .inConts .graph02 p{font-size:2.5rem;} .introduction-conts .area-advantage03 .inConts .area-box .sbox div p{font-size:3rem;} .introduction-conts.advantage .profile .sbox .textbox>p{font-size:2.5rem; line-height:3.5rem;} .introduction-conts .area-advantage04 .inConts .area-box li{font-size:2.5rem; line-height:normal;} .introduction-conts .area-advantage04 .inConts .area-box li span{top:0.8rem;} .introduction-conts.advantage .profile .profile_list .imgbox .rbox h2{font-size:4rem; line-height:normal;} .introduction-conts.advantage .profile .profile_list .imgbox .rbox h3{font-size:3rem;} .introduction-conts.advantage .profile .profile_list .text div strong{font-size:3rem;} .introduction-conts .inConts .list .sbox .box>p strong{display:block;} .introduction-conts .area-advantage09 .inConts .list .imgbox div span{top:18rem; margin-left:-60rem; width:25rem; font-size:2.5rem;} .introduction-conts .area-advantage09 .inConts .list .imgbox div ul{top:34rem; margin-left:32.5rem;} .introduction-conts .area-advantage09 .inConts .list .imgbox div ul li{font-size:2.5rem; line-height:normal;} .introduction-conts .area-advantage09 .inConts .list .imgbox div ul li:before{top:10px;} .introduction-conts .area-advantage09 .inConts .list .sbox .box p a{margin-top:-3.5rem;} .introduction-conts.advantage .profile .sbox .textbox .imgbox4 div{width:150px; height:150px;} .introduction-conts .area-advantage03 .inConts .area-box .sbox div ul li{padding:0 0 0 4rem;} .introduction-conts .area-advantage15:before{background-position:-100px center;} .introduction-conts .area-advantage15:after{background-position:-300px center;} .introduction-conts .area-advantage15 .vs:before{width:10rem; height:10rem;} .introduction-conts .area-advantage15 .text1{padding-right:9rem;} .introduction-conts .area-advantage15 .text2{padding-left:9rem;} .area-hearingaid02 .inConts .area-box01 .tabbox .imgbox div{margin:0 0.5rem;} /* swiperbtn */ .introduction-conts.hearingaid .inConts .tabbox .swiperbtn{width:30px; height:30px;} .introduction-conts.hearingaid .inConts .tabbox .button-prev{left:6rem;} .introduction-conts.hearingaid .inConts .tabbox .button-next{right:6rem;} .introduction-conts.hearingaid .inConts .tabbox .swiperbtn:after{margin-top:-0.6rem;} .introduction-conts.hearingaid .inConts .tabbox .swiperbtn:before, .introduction-conts.hearingaid .inConts .tabbox .swiperbtn:after{width:12px; border-width:5px;} .introduction-conts.hearingaid .inConts .tabbox .button-prev:before, .introduction-conts.hearingaid .inConts .tabbox .button-prev:after{left:10px;} .introduction-conts.hearingaid .inConts .tabbox .button-next:before, .introduction-conts.hearingaid .inConts .tabbox .button-next:after{right:10px;} /*[e] Sub Style */ #quickbtn div img{width:50px;} .introduction-conts.advantage{padding:0 1rem;} .introduction-conts.advantage .area-advantage03 .inConts .area-box{display:block;} .introduction-conts.advantage .area-advantage03 .inConts .area-box>div{width:100%;} .introduction-conts.advantage .area-advantage03 .inConts .area-box .sbox{margin-top:5rem;} .area-hearingaid05 .inConts .hearingalist .text div{font-size:2.5rem;} .area-hearingaid05 .inConts .hearingalist .text p{font-size:2.5rem; line-height:3.5rem;} .area-hearingaid05 .inConts .hearingalist .text p span{display:block;} .area-hearingaid05 .inConts .largebox{display:block;} .area-hearingaid05 .inConts .largebox .box{width:100%;} .area-hearingaid05 .inConts .largebox .box2{margin-top:1rem;} .area-hearingaid05 .inConts .largebox .box .img{width:40%;} .area-hearingaid05 .inConts .largebox .box .basic table th, .area-hearingaid05 .inConts .largebox .box .basic table td{font-size:2.5rem;} .area-hearingaid05 .inConts .largebox .box .basic table th, .area-hearingaid05 .inConts .largebox .box .basic table td{padding:1rem;} .area-hearingaid06 .process4 .inConts h2 span{display:block;} .area-hearingaid06 .process3 .inConts .textbox{padding:5rem 2rem;} .area-hearingaid06 .process3 .inConts .textbox ul li{padding-left:4rem; font-size:2.5rem;} .area-hearingaid06 .process .inConts .processlist .box .img div span img{width:50px;} .area-hearingaid06 .process .inConts .processlist .box .day{transform:translateY(-7rem)} .area-hearingaid06 .process5 .inConts .processlist{display:block;} .introduction-conts.hearingaid .area-hearingaid06 .process5 .inConts .processlist .box{width:100%;} .area-hearingaid06 .process5 .inConts .processlist .box2{margin-top:2rem;} .area-hearingaid06 .process5 .inConts .textbox div{font-size:3rem;} .area-hearingaid06 .process5 .inConts .textbox ul li{padding-left:4rem; font-size:2.5rem;} .area-hearingaid06 .process5 .inConts .textbox p{font-size:2rem;} .introduction-conts.advantage .inConts .list .sbox .box p a{margin-top:0;} .introduction-conts .area-advantage09 .inConts .list .sbox .box p a{margin-top:-3.5rem;} .introduction-conts.advantage .area-advantage09 .inConts .list .imgbox div img{width:40%;} .introduction-conts.advantage .area-advantage09 .inConts .list .imgbox div span{top:8rem; width:10rem; margin-left:-25rem; font-size:1.8rem;} .introduction-conts.advantage .area-advantage09 .inConts .list .imgbox div ul{top:10rem; margin-left:6rem;} .introduction-conts.advantage .area-advantage09 .inConts .list .imgbox div ul li{font-size:1.8rem;} .introduction-conts.advantage .area-advantage09 .inConts .list .imgbox div ul li:before{top:5px;} .introduction-conts.advantage .profile{padding:8rem 0rem;} .introduction-conts.advantage .area-advantage18{background-position:-200px center;} .introduction-conts .inConts .tab-slide ul{flex-wrap: wrap;} .introduction-conts .inConts .tab-slide ul li{width:50%;} .area-hearingaid05 .inConts .imgbox .textbox{width:90%;} .introduction-conts .area-people .thumb .tab li{width: calc((100% - 2rem)/3);margin: 0;margin-bottom:2rem;} .process7-area{} .process7-area>ol>li{padding-left:1.6rem; font-size:2rem;} .process7-area>ol>li>ol{} .process7-area ol.nom>li, .process7-area>ol>li>ol>li{padding-left:2.7rem;} .process7-area>ol>li>dl{} .process7-area>ol>li>dl>dt{width:9.4rem;} .process7-area>ol>li>dl>dt>span{width:8.4rem; height:4.1rem;} .process7-area>ol>li>dl>dd{width:calc(100% - 9.4rem);} .process7-area ul.bul{} .process7-area ul.bul>li{font-size:2rem; line-height:3rem;} .process7-area .last{font-size:2.6rem;} .process7-area .last+div{font-size:2.4rem;} } @media only screen and (max-width : 768px){ .geneContents{padding: 0 1rem;} .geneTitle{gap: 3rem;} .geneTitle .titleZone{width: 100%; align-items: center;} } @media only screen and (max-width : 640px){ .newMedal .imgArea{width: calc((100% - 6rem)/3);} .newMedal .imgArea:nth-child(n + 4){width: calc((100% - 6rem)/3);} } @media only screen and (max-width : 480px){ .introduction-conts .area-people .thumb .tab li a div{width:80px; height:80px;} .introduction-conts.online{height:40rem; background-position:right top;} .area-hearingaid05 .inConts .imgbox .textbox{padding-top:3rem;} .area-hearingaid06 .pageTop h4{font-size:2.5rem;} .area-hardtocall .area-box .inConts .linkbox{height:auto; padding:3rem 1rem;} } /* transform: scale(1.1) 부분을 transform: scale(1.1) rotate(.001deg); 로 변경하면 부드럽게 처리되네요 display: flex; flex-wrap: wrap; flex-direction: row; align-content: center; justify-content: center; -ms-flex-align:center; display: flex; flex-wrap: wrap; flex-direction: row; align-items: center; justify-content: center; -ms-flex-align:center; 맨 앞에 정렬 justify-content: flex-start; ​ 맨 끝에 정렬 justify-content: flex-end; 가운데 정렬 justify-content: center; 서로 같은 간격으로 박스들이 조정됨. justify-content: space-between;​ 컨텐츠 뿐만 아니라 그 주변도 같은 간격으로 조정됨. justify-content: space-around; ​ * 수직으로 적용 align-items 컨테이너의 꼭대기로 정렬 justify-content: flex-start ​ 컨테이너의 바닥으로 정렬 flex-end​ 가운데로 정렬 center 컨테이너의 시작 위치에 정렬 baseline​ 컨테이너에 맞도록 늘린다. stretch .list_ol_01 {counter-reset:item; margin-bottom:10px;} .list_ol_01 > li {position: relative; font-size: 16px; line-height: 1.75; margin-bottom:4px; color: #636363; padding-left:26px;} .list_ol_01 > li:last-child {margin-bottom: 0;} .list_ol_01 > li:before {counter-increment: item; content: counter(item); width: 18px; height: 18px; display: inline-block; background: #fff; border:1px solid #636363; color: #636363; border-radius: 50%; text-align: center; line-height:18px; font-size: 10px; position: absolute; top: 5px; left: 0; font-weight:400;} -webkit-transform: translateY(-50%); transform: translateY(-50%); -webkit-transform: translateX(-50%); transform: translateX(-50%); filter:grayscale(100%) blur(0px); -webkit-filter:grayscale(100%) blur(0px); transition: all .5s linear; transition: all .5s ease-out; transform:rotate(180deg); -webkit-transition-timing-function:ease-in linear; transition-timing-function:ease-in linear; -webkit-transition-delay: .8s; transition-delay: .8s; :before{content: ""; width: 24px; height: 24px; background-color: #fff; border:1px solid #666; display: inline-block; position:absolute; left: 0; top:0px; box-sizing: border-box;} display: flex; justify-content: space-between; // 양쪽 끝 정렬 display: flex; justify-content: space-around; // 센터 정렬 display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; //한줄 감추기 display: block; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; //두줄 감추기 active :first-child text-indent:-99999px; !important display:table; table-layout:fixed; display:table-row; display:table-cell; box-sizing:border-box; word-break:keep-all; word-wrap:break-word; border-radius:2px; */