@charset "utf-8"; @import url('/css/global/normalize.css'); @import url('/css/global/reset.css'); @import url('/css/global/fullpage.css'); @import url('/css/global/common.css'); @import url('/css/global/fontawesome.css'); @import url('/css/home/popup.css'); /* span,div,p,a,h1, h2, h3, h4, h5, h6{transform: skew(-0.001deg);} 나눔 폰트 깨짐 현상 해결책 */ /*-------------------------------------------------------------------- ||공통설정 --------------------------------------------------------------------*/ #msg {display:inline-block;padding:10px 0 10px 0;position:fixed;z-index:1000000000000;background:gray;color:white;} body{width:100%;margin:0;padding:0;background-color:#fff;} em {font-style:normal;} #wrap .fp-tableCell {vertical-align:top;} @keyframes progress { 0%{background-size:0% 100%;} 25%{background-size:25% 100%;} 50%{background-size:50% 100%} 75%{background-size:75% 100%} 100%{background-size:100% 100%} } /*-------------------------------------------------------------------- ||MO --------------------------------------------------------------------*/ #section1 {background-image:url('/resource/image/home/bg1.jpg'); background-repeat:no-repeat;background-size:cover;background-position:center top;} #section2 {background-image:url('/resource/image/home/bg2.jpg'); background-repeat:no-repeat;background-size:cover;background-position:center top;} #section3 {background-image:url('/resource/image/home/bg3.jpg'); background-repeat:no-repeat;background-size:cover;background-position:left top;} #section4 {background-image:url('/resource/image/home/bg4.jpg'); background-repeat:no-repeat;background-size:cover;background-position:center top;background:#7aa3e1;} #section5 {background-image:url('/resource/image/home/bg5.jpg'); background-repeat:no-repeat;background-size:cover;background-position:center center;} #section6 {background-image:url('/resource/image/home/bg6.jpg'); background-repeat:no-repeat;background-size:cover;background-position:center right;} #section7 {background-image:url('/resource/image/home/bg7.jpg'); background-repeat:no-repeat;background-size:cover;background-position:center top;background:#cccccc;} #section8 {background-image:url('/resource/image/home/bg8.jpg'); background-repeat:no-repeat;background-size:cover;background-position:center top;} #section9 {background-image:url('/resource/image/home/bg9.jpg'); background-repeat:no-repeat;background-size:cover;background-position:center top;} #section10 {background-image:url('/resource/image/home/bg10.jpg'); background-repeat:no-repeat;background-size:cover;background-position:center top;} #section11 {background-image:url('/resource/image/home/bg11.jpg'); background-repeat:no-repeat;background-size:cover;background-position:center top;background:#f3f3f3;} #section12 {background-image:url('/resource/image/home/bg12.jpg'); background-repeat:no-repeat;background-size:cover;background-position:center top;} #section13 {background-image:url('/resource/image/home/bg13.jpg'); background-repeat:no-repeat;background-size:cover;background-position:left top;} @media screen and (max-width: 768px){ #inquiryAgreePopup {display:none;position:fixed;top:0;z-index:10000000;width:100%;height:100%;background:rgba(0,0,0,0.8);text-align:center;} #inquiryAgreePopup .contents {padding:2vw;width:80vw;height:65vh;overflow-x:hidden;overflow-y:scroll;text-align:left;margin:20vw auto 0 auto;background:white;font-size:12px;line-height:16px;font-weight:400;color:#777777;} #inquiryAgreePopup .contents b {color:#333333;font-size:14px;font-family:'NEXON Lv2 Gothic Bold';font-weight:400;} #inquiryAgreePopup .button {padding:10px;width:80vw;background:#f0c757;margin:0 auto;} #inquiryAgreePopup .button a {color:white;font-size:14px;font-weight:bold;} @keyframes drawLines { 20% {opacity:1;border-left:0.6vw solid #3d6aa9;border-top:0.6vw solid #3d6aa9;} 25% {opacity:1;border-top:0.6vw solid #3d6aa9;border-right:0.6vw solid #3d6aa9;} 75% {opacity:1;border-right:0.6vw solid #3d6aa9;border-bottom:0.6vw solid #3d6aa9;} 100% {opacity:1;border-bottom:0.6vw solid #3d6aa9;} } html {} body {min-height:100vh;} #wrap {} #wrap .width_area {width:100%;margin:0 auto;} #wrap .width_area:after {display:block;clear:both;content:"";} #container {} #container .section.default {} #movie {display:none;} #quick {display:;} #quick .link {position:fixed;z-index:1000000;margin:100vw 0 0 87vw;} #quick .link ul {font-size:0;} #quick .link ul > li {width:9vw;height:9vw;padding:1vw;display:block;border-radius:50%;margin:0 0 2vw 0;border:0.3vw solid #ffffff;} #quick .link ul > li .icon {padding:1vw 0 0 0;display:block;text-align:center;line-height:9vw;} #quick .link ul > li .icon img {width:5.5vw;} #quick .link ul > li .text {display:none;} #quick .link ul > li:nth-child(1) {background:#2e7596;} #quick .link ul > li:nth-child(2) {background:#365c53;} #quick .link ul > li:nth-child(3) {background:#5e8562;} #quick .link ul > li:nth-child(4) {display:none;} #quick .link ul > li:nth-child(5) {display:none;} #quick .link ul > li:nth-child(6) {display:none;} #quick .link ul > li:nth-child(7) {background:#252d39;} #quick .link ul > li:nth-child(8) {background:#2457a6;text-align:center;} #quick .link ul > li:nth-child(8) a {color:#ffffff;font-size:3vw;line-height:9vw;font-family:"NEXON Lv2 Gothic Bold";} /* #quick .link ul > li:nth-child(5) {background:linear-gradient(50deg, #c035a8, #783dba);} */ #inquiry {background:#f0c757;position:absolute;z-index:100;} #inquiry .box {padding:3vw 0 2vw 0;text-align:center;} #inquiry .box {width:100vw;margin:0 auto 0 auto;} #inquiry .box .title {display:block;width:100%;text-align:center;} #inquiry .box .title .subject {display:block;padding:0 0 0 0;font-family:"NEXON Lv2 Gothic Bold";color:#55474c;font-size:5vw;letter-spacing:-1px;} #inquiry .box .title .description {display:block;padding:7px 0 0 0;font-family:"NEXON Lv2 Gothic";color:#55474c;font-size:16px;letter-spacing:0;display:none;} #inquiry .box .form:before {display:block;content:"";} #inquiry .box .form {display:inline-block;width:68vw;vertical-align:middle;padding:3vw 0 3vw 0 ;text-align:center;background:transparent;} #inquiry .box .form .item {font-size:0;display:inline-block;} #inquiry .box .form .item.text {} #inquiry .box .form .item.text input {width:29vw;height:9vw;padding:0 0 0 1vw;font-size:3.5vw;font-family:"NEXON Lv2 Gothic";color:white;background:#55474c;border:0 solid #55474c;} #inquiry .box .form .item.select {} #inquiry .box .form .item.select select {width:35vw;height:9vw;padding:0 0 0 1vw;border:0 solid #55474c;font-size:3.5vw;font-family:"NEXON Lv2 Gothic";color:white;background:#55474c;border:0 solid #55474c;} #inquiry .box .form .item.select select { background: url('/resource/image/common/select_arrow.jpg') no-repeat 95% 50%; background-size:15%; background-color:#55474c; border-radius: 0px; -webkit-appearance: none; -moz-appearance: none; appearance: none; } select::-ms-expand { display:none; display:hidden; } #inquiry .box .form .item.text.phone {padding-top:1vw;} #inquiry .box .form .item.text.quantity {padding-top:1vw;} #inquiry .box .funciton {display:inline-block;width:20vw;vertical-align:middle;text-align:left;background:transparent;} #inquiry .box .funciton button {background:#55474c;width:20vw;height:19vw;font-family:"NEXON Lv2 Gothic Bold";color:white;font-size:4vw;text-align:center;border:0;letter-spacing:-0.2vw;} #inquiry .box .check {display:block;margin:0 0 0 0;padding:0 0 0 0;vertical-align:middle;text-align:center;} #inquiry .box .check .item {display:inline-block;vertical-align:middle;;} #inquiry .box .check .text label {font-family:"NEXON Lv2 Gothic Bold";font-size:3vw;} #inquiry .box .check .description {display:inline-block;vertical-align:middle;font-size:2.5vw;padding:0 0 0 2vwx;} #inquiry .box .check br {display:none;} #inquiry .box .check a {display:inline-block;color:black;padding:0 0 0 2vw;} #header {display:;} #gnb {position:fixed;z-index:10000;width:100%;background:rgba(255, 255, 255, 1);box-shadow:0 0 0 rgba(0,0,0,0);} #gnb .gnb_group {} #gnb .logo_area {display:inline-block;width:100vw;height:15vw;background:transparent;text-align:center;} #gnb .logo_area:before {display:inline-block;height:100%;vertical-align:middle;content:"";} #gnb .logo_area img {width:23vw;vertical-align:middle;transform:translate(0,0);} #gnb .menu_area {display:block;width:100vw;height:12vw;background:#006ebc;text-align:center;overflow-x:scroll;} #gnb .menu_area ul {display:inline-block;padding:0;vertical-align:middle;margin:4vw 0 0 0;width:145vw;} #gnb .menu_area ul > li {display:inline-block;text-align:center;background:transparent;} #gnb .menu_area a {font-size:4.2vw;color:#ffffff;padding:0 1.5vw 0 1.5vw;} #gnb .menu_area .linkOn a {font-size:4.2vw;color:#fff062;transition:all .8s;} #gnb .menu_area .linkOff {font-size:4.2vw;color:#000000;} #section1 {display:;} #section1 .section_group {} #section1 .visual {display:block;width:100%;left:0;} #section1 .visual .visual1 {position:absolute;z-index:50;} #section1 .visual .visual1 img {width:80vw;position:absolute;margin:110vw 0 0 15vw;opacity:1;} #section1 .visual .visual2 {position:absolute;z-index:95;margin:120vw 0 0 65vw;opacity:1;display:;} #section1 .visual .visual2.on {opacity:1;transition:all 2s;} #section1 .visual .visual2 .box {margin:0 0 0 0;} #section1 .visual .visual2 .card {} #section1 .visual .visual2 .card .position {display:inline-block;font-size:3vw;color:white;} #section1 .visual .visual2 .card .name {display:inline-block;font-size:3vw;color:white;font-family:"NEXON Lv2 Gothic Bold";padding:0 0 0 2vw;} #section1 .visual .visual2 .sign {color:white;font-size:4vw;font-family:"High Summit";padding:2vw 0 0 0;} #section1 .element {padding:0 0 7vw 0;} #section1 .element .introduce:before {display:block;height:65vw;content:"";} #section1 .element .introduce {} #section1 .element .introduce dl {} #section1 .element .introduce dl > dt {text-align:center;} #section1 .element .introduce dl > dt .line1 {} #section1 .element .introduce dl > dt .line1 .inBox {display:inline-block;font-size:3.5vw;line-height:6vw;letter-spacing:-0.1vw;color:#ffffff;width:90vw;padding:1vw 0 1vw 0;background:transparent;text-align:center;border-radius:0 0 0 0;transform:translatey(120px);} #section1 .element .introduce dl > dt .line1 .inBox b {font-size:4vw;color:#b2d2f0;font-family:"NEXON Lv2 Gothic Bold";} #section1 .element .introduce dl > dt .line1 .on {opacity:1;background:linear-gradient(90deg, #244565, #042b50);background-repeat:no-repeat;-webkit-animation: progress 1s linear;-moz-animation: progress 1s linear;-o-animation: progress 1s linear;animation: progress 1s linear;} #section1 .element .introduce dl > dt .line2 {font-size:7vw;line-height:8.5vw;color:#ffffff;font-family:"NEXON Lv2 Gothic Bold";margin:3vw 0 0 0;letter-spacing:-0.2vw;} #section1 .element .introduce dl > dt .line2 b {font-size:7vw;color:#cce7ff;font-family:"NEXON Lv2 Gothic Bold";} #section1 .element .introduce dl > dd {text-align:center;} #section1 .element .introduce dl > dd:before {display:block;content:"";height:85vw;} #section1 .element .introduce dl > dd .box {} #section1 .element .introduce dl > dd .box .description1 {} #section1 .element .introduce dl > dd .box .description1 .inBox {position:relative;z-index:100;width:85vw;margin:0 auto;color:#2e75b6;font-size:3.5vw;line-height:5vw;letter-spacing:-0.2vw;text-align:left;padding:4vw 2vw 4vw 2vw;font-family:"NEXON Lv2 Gothic Bold";background:white;border-top:0.8vw solid #2e75b6;} /*background:linear-gradient(90deg, #4286bf, transparent);*/ #section2 {display:;} #section2 .section_group {} #section2 .element {position:relative;z-index:30;} #section2 .element .introduce:before {display:block;height:10vw;content:"";} #section2 .element .introduce {text-align:center;} #section2 .element .introduce dl {} #section2 .element .introduce dl > dt {} #section2 .element .introduce dl > dt .line1 {color:#000000;font-size:4vw;} #section2 .element .introduce dl > dt .line1 b {color:#000000;font-size:5vw;font-family:"NEXON Lv2 Gothic Bold";} #section2 .element .introduce dl > dt .line2 {margin:0 0 0 0;color:#000000;font-size:4vw;} #section2 .element .introduce dl > dt .line2 em {color:#000000;font-size:5vwx;font-family:"NEXON Lv2 Gothic Bold";} #section2 .element .introduce dl > dt .line2 b:before {display:block;content:"";height:3vw;} #section2 .element .introduce dl > dt .line2 b {color:#3d6aa9;font-size:10vw;letter-spacing:-10vw;font-family:"NEXON Lv2 Gothic Bold";opacity:0;} #section2 .element .introduce dl > dt .line2 b.on {letter-spacing:0;opacity:1;transition:all 1s;} #section2 .element .introduce dl > dt .line3 i {display:inline-block;height:5vw;margin:3vw 0 3vw 0;border-right:0.5vw solid #333333;font-size:0;} #section2 .element .introduce dl > dt .line4 {display:inline-block;width:80vw;margin:0 auto;color:#000000;font-size:3.4vw;letter-spacing:-0.2vw;line-height:5vw;padding:3vw 3vw 3vw 3vw;background:transparent;border-radius:0;border:0.6vw solid transparent;border-radius:25vw;} #section2 .element .introduce dl > dt .line4.on {-webkit-animation: drawLines 2s linear;-moz-animation: drawLines 1s linear;-o-animation: drawLines 1s linear;animation: drawLines 1s linear;} #section2 .element .introduce dl > dt .line4 br {display:none;} #section2 .element .introduce dl > dt .line4 b {color:#3d6aa9;font-size:3.5vw;font-family:"NEXON Lv2 Gothic Bold";} #section2 .element .introduce dl > dt .line4 em {color:#000000;font-size:3.5vw;font-family:"NEXON Lv2 Gothic Bold";} #section2 .element .introduce dl > dd {} #section2 .element .introduce dl > dd:before {display:block;content:"";height:4vw;} #section2 .element .introduce dl > dd .box {} #section2 .element .introduce dl > dd .box .description1 {} #section2 .element .introduce dl > dd .box .description1 ul {font-size:0;} #section2 .element .introduce dl > dd .box .description1 ul > li {display:block;width:60vw;margin:0 auto 0 auto;padding:0 0 4vw 0;} #section2 .element .introduce dl > dd .box .description1 ul > li img {width:100%;height:auto;border:3px solid white;} #section3 {display:;} #section3 .section_group {} #section3 .element {} #section3 .element .introduce:before {display:block;height:10vw;content:"";} #section3 .element .introduce {font-size:0;text-align:center;background:transparent;} #section3 .element .introduce .summary {display:inline-block;padding:0 0 0 0;text-align:center;background:transparent;} #section3 .element .introduce .summary .title {display:inline-block;background:transparent;} #section3 .element .introduce .summary .title1 {color:#ffffff;margin-top:0;font-size:5vw;} #section3 .element .introduce .summary .title1 b {color:#ffffff;margin-top:0;font-size:5vw;font-family:"NEXON Lv2 Gothic Bold";} #section3 .element .introduce .summary .title2 {display:block;opacity:0;color:#acd4f9;margin-top:3vw;font-size:7vw;letter-spacing:-7vw;font-family:"NEXON Lv2 Gothic Bold";} #section3 .element .introduce .summary .title2.on {opacity:1;letter-spacing:0;transition:all 1s;} #section3 .element .introduce .summary .title3 {color:#fff06e;margin-top:4vw;font-size:4vw;padding:1vw 0 1vw 0;width:40vw;border:0.3vw solid #fff06e;text-align:center;} #section3 .element .introduce .summary .visual {margin:5vw 0 0 0;} #section3 .element .introduce .summary .visual .item1 {} #section3 .element .introduce .summary .visual .item2 {} #section3 .element .introduce .summary .visual .item3 {} #section3 .element .introduce .summary .visual .item img {left:0;position:absolute;} #section3 .element .introduce .summary .visual .item1 img {z-index:60;margin:5% 0 0 60%;width:20%;display:;} #section3 .element .introduce .summary .visual .item2 img {z-index:50;margin:7vw 0 0 27.5%;width:45%;display:;} #section3 .element .introduce .summary .visual .item3 img {z-index:60;margin:30% 0 0 67%;width:10%;display:;} #section3 .element .introduce .detail {margin:50vw 0 7vw 0;display:inline-block;vertical-align:top;text-align:center;background:transparent;} #section3 .element .introduce .detail .title {display:inline-block;color:#ffffff;font-size:5vw;font-family:"NEXON Lv2 Gothic Bold";} #section3 .element .introduce .detail .description {margin:3vw 0 0 0;display:inline-block;color:#cccccc;font-size:4vw;line-height:5vw;} #section3 .element .introduce .detail .description b {color:#cccccc;font-size:4vw;font-family:"NEXON Lv2 Gothic Bold";} #section3 .element .introduce .detail .box1 {margin:4vw 0 0 0;} #section3 .element .introduce .detail .box1 ul {width:68vw;margin:0 auto;} #section3 .element .introduce .detail .box1 ul > li {display:block;padding:0 0 2vw 0;text-align:left;} #section3 .element .introduce .detail .box1 ul > li .icon {display:inline-block;vertical-align:middle;background:white;width:7vw;height:7vw;line-height:7vw;border-radius:50%;text-align:center;} #section3 .element .introduce .detail .box1 ul > li .icon img {width:5vw;vertical-align:middle;} #section3 .element .introduce .detail .box1 ul > li .txt {display:inline-block;vertical-align:middle;color:#cccccc;font-size:3.5vw;padding:0 0 0 2vw;} #section3 .element .introduce .detail .box2 {margin:7vw auto 0 auto;padding:0 0 0 0;width:90vw;background:#ffffff;} #section3 .element .introduce .detail .box2 .subTitle {display:inline-block;background:#3b6aab;margin:-10vw 0 0 0;padding:2vw 3vw 2vw 3vw;color:white;font-size:4;} #section3 .element .introduce .detail .box2 .subTitle b {display:inline-block;color:#fff06e;font-size:4vw;font-family:"NEXON Lv2 Gothic Bold";} #section3 .element .introduce .detail .box2 ul {margin:2vw 0 0 5vw;background:transparent;} #section3 .element .introduce .detail .box2 ul > li {padding:0 0 2vw 0;text-align:left;} #section3 .element .introduce .detail .box2 ul > li .icon {display:inline-block;vertical-align:middle;} #section3 .element .introduce .detail .box2 ul > li .icon img {width:5vw;} #section3 .element .introduce .detail .box2 ul > li .txt {display:inline-block;vertical-align:middle;padding:0 0 0 2vw;color:#323232;font-size:3.5vw;} #section4 {display:;} #section4 .section_group {} #section4 .element {} #section4 .element .introduce:before {display:block;height:10vw;content:"";} #section4 .element .introduce {text-align:center;} #section4 .element .introduce dl {} #section4 .element .introduce dl > dt {} #section4 .element .introduce dl > dt .line1 {color:#ffffff;font-size:5vw;line-height:8vw;font-family:"NEXON Lv2 Gothic Bold";} #section4 .element .introduce dl > dt .line1 em {opacity:0;display:block;color:#222a35;font-size:7vw;letter-spacing:-7vw;font-family:"NEXON Lv2 Gothic Bold";text-align:center;} #section4 .element .introduce dl > dt .line1 em.on {opacity:1;letter-spacing:0;transition:all 1s;} #section4 .element .introduce dl > dt .line2 {margin:3vw 0 0 0;color:#222a35;font-size:4vw;line-height:5vw;} #section4 .element .introduce dl > dt .line2 b {display:block;padding:4vw 0 1vw 0;color:#fff06e;font-size:7vw;font-family:"NEXON Lv2 Gothic Bold";} #section4 .element .introduce dl > dt .line2 em {display:block;width:70vw;margin:-3vw auto 2vw auto;background:#222a35;padding:1.5vw 0 1.5vw 0;color:#ffffff;font-size:4.5vw;font-family:"NEXON Lv2 Gothic Bold";border-radius:5vw;} #section4 .element .introduce dl > dt .line2 p {} #section4 .element .introduce dl > dt .line2 p br {display:none;} #section4 .element .introduce dl > dd {padding:0 0 2vw 0;} #section4 .element .introduce dl > dd:before {display:block;content:"";height:6vw;} #section4 .element .introduce dl > dd .box {width:100vw;margin:0 auto 0 auto;text-align:center;background:transparent;} #section4 .element .introduce dl > dd .box .process .item {display:inline-block;width:80vw;margin:0 auto 0 auto;background:transparent;} #section4 .element .introduce dl > dd .box .process .item ul {font-size:0;width:inline-block;background:transparent;} #section4 .element .introduce dl > dd .box .process .item ul > li {display:block;width:80vw;margin:0 0 5vw 0;padding:3vw 0 2vw 0;text-align:left;background:#ffffff;border-radius:5vw 0 5vw 0;box-shadow:0 0 3px gray;border:0.6vw solid transparent;} #section4 .element .introduce dl > dd .box .process .item ul > li:nth-child(1) {} #section4 .element .introduce dl > dd .box .process .item ul > li:nth-child(2) {margin-right:0;} #section4 .element .introduce dl > dd .box .process .item ul > li:nth-child(3) {} #section4 .element .introduce dl > dd .box .process .item ul > li:nth-child(4) {margin-right:0;} #section4 .element .introduce dl > dd .box .process .item ul > li .visual {width:30vw;display:inline-block;vertical-align:middle;padding:0 0 0 5vw;background:transparent;} #section4 .element .introduce dl > dd .box .process .item ul > li .visual img {width:100%;height:auto;border:0.3vw solid #cccccc;} #section4 .element .introduce dl > dd .box .process .item ul > li .step {position:absolute;display:inline-block;vertical-align:middle;margin:3vw 0 0 5vw;background:#222a35;width:7vw;height:7vw;color:white;font-size:3.5vw;line-height:7vw;font-family:"NEXON Lv2 Gothic Bold";border:0.3vw solid #ffffff;text-align:center;} #section4 .element .introduce dl > dd .box .process .item ul > li .summary {display:inline-block;vertical-align:middle;margin:8vw 0 0 5vw;color:#333333;font-size:3.8vw;line-height:6vw;font-family:"NEXON Lv2 Gothic Bold";letter-spacing:-0.3vw;} #section4 .element .introduce dl > dd .box .process .article {display:block;margin:0 0 0 0;width:100%;display:none;} #section4 .element .introduce dl > dd .box .process .article table {width:100%;} #section4 .element .introduce dl > dd .box .process .article td {} #section4 .element .introduce dl > dd .box .process1 {display:inline-block;padding:0 0 0 0;} #section4 .element .introduce dl > dd .box .process2 {display:inline-block;padding:0 0 0 0;} /* #section4 .element .introduce dl > dd .box .process1 .article .left {width:20%;border-left:1px solid #ffffff;} #section4 .element .introduce dl > dd .box .process1 .article .left span {display:block;width:100%;height:1px;background:white;font-size:0;} #section4 .element .introduce dl > dd .box .process1 .article .center {color:#fff06e;font-size:21px;} #section4 .element .introduce dl > dd .box .process1 .article .right {width:20%;border-right:1px solid #ffffff;} #section4 .element .introduce dl > dd .box .process1 .article .right span {display:block;width:100%;height:1px;background:white;font-size:0;} #section4 .element .introduce dl > dd .box .process2 .article .left {width:1%;border-left:1px solid #ffffff;} #section4 .element .introduce dl > dd .box .process2 .article .left span {display:block;width:100%;height:0px;background:white;font-size:0;} #section4 .element .introduce dl > dd .box .process2 .article .center {color:#fff06e;font-size:21px;} #section4 .element .introduce dl > dd .box .process2 .article .right {width:1%;border-right:1px solid #ffffff;} #section4 .element .introduce dl > dd .box .process2 .article .right span {display:block;width:100%;height:0px;background:white;font-size:0;} */ #section5 {display:;} #section5 .section_group {} #section5 .element {} #section5 .element .introduce:before {display:block;height:10vw;content:"";} #section5 .element .introduce {text-align:center;} #section5 .element .introduce dl {} #section5 .element .introduce dl > dt {} #section5 .element .introduce dl > dt .line1 {color:#333333;font-size:5vw;line-height:6vw;} #section5 .element .introduce dl > dt .line1 b:before {display:block;content:"";} #section5 .element .introduce dl > dt .line1 b {color:#3d6aa9;font-size:5vw;font-family:"NEXON Lv2 Gothic Bold";} #section5 .element .introduce dl > dt .line2 {margin:4vw 0 0 0;color:#333333;font-size:7vw;letter-spacing:-0.3vw;} #section5 .element .introduce dl > dt .line2 b {display:block;opacity:0;color:#3d6aa9;font-size:7vw;letter-spacing:-7vw;font-family:"NEXON Lv2 Gothic Bold";} #section5 .element .introduce dl > dt .line2 b.on {opacity:1;letter-spacing:0;transition:all 1s;} #section5 .element .introduce dl > dd {} #section5 .element .introduce dl > dd:before {display:block;content:"";height:7vw;} #section5 .element .introduce dl > dd .box {} #section5 .element .introduce dl > dd .box .description1 {} #section5 .element .introduce dl > dd .box .description1 ul {font-size:0;} #section5 .element .introduce dl > dd .box .description1 ul > li {display:block;margin:0 auto 3.3vw auto;} #section5 .element .introduce dl > dd .box .description1 ul > li img {width:70vw;height:auto;border:0.6vw solid white;} #section6 {display:;} #section6 .section_group {} #section6 .element {} #section6 .element .introduce:before {display:block;height:90vw;content:"";} #section6 .element .introduce {font-size:0;text-align:center;background:transparent;} #section6 .element .introduce .detail {display:inline-block;width:95vw;padding:0 0 7vw 0;text-align:center;background:transparent;} #section6 .element .introduce .detail .title {display:inline-block;padding:0 0 0 0;color:#ffffff;font-size:5vw;font-family:"NEXON Lv2 Gothic Bold";} #section6 .element .introduce .detail .description1 {display:inline-block;padding:3vw 0 0 0;color:#cccccc;font-size:3.5vw;line-height:5vw;} #section6 .element .introduce .detail .description1 b {color:#eeeeee;font-size:3.5vw;font-family:"NEXON Lv2 Gothic Bold";} #section6 .element .introduce .detail .description2 {display:inline-block;margin:4vw 0 2vw 0;padding:1.3vw 0 1.3vw 0;color:#cccccc;font-size:3.5vw;line-height:5vw;border-top:0.2vw solid #cccccc;border-bottom:0.2vw solid #cccccc;} #section6 .element .introduce .detail .description2 b {color:#eeeeee;font-size:3.5vw;font-family:"NEXON Lv2 Gothic Bold";} #section6 .element .introduce .detail .box1 {width:80vw;margin:4vw auto 0 auto;} #section6 .element .introduce .detail .box1 ul {} #section6 .element .introduce .detail .box1 ul > li {padding:0 0 3vw 0;text-align:left;} #section6 .element .introduce .detail .box1 ul > li .icon {display:inline-block;vertical-align:middle;background:white;width:7vw;height:7vw;line-height:7vw;border-radius:50%;text-align:center;} #section6 .element .introduce .detail .box1 ul > li .icon img {width:5vw;vertical-align:middle;} #section6 .element .introduce .detail .box1 ul > li .txt {display:inline-block;vertical-align:middle;color:#ffffff;font-size:3.5vw;letter-spacing:-0.2vw;padding:0 0 0 2vw;} #section6 .element .introduce .detail .box2 {margin:0 0 0 0;width:90vw;margin:7vw auto 0 auto;padding:0 0 0 0;background:#ffffff;} #section6 .element .introduce .detail .box2 .subTitle {display:inline-block;width:80vw;background:#3b6aab;margin:0 0 0 0;padding:2vw 0 2vw 0;transform:translatey(-3.3vw);color:white;font-size:3.5vw;letter-spacing:-0.3vw;} #section6 .element .introduce .detail .box2 .subTitle b {display:inline-block;color:#fff06e;font-size:3.5vw;font-family:"NEXON Lv2 Gothic Bold";} #section6 .element .introduce .detail .box2 ul {margin:0 0 0 7vw;} #section6 .element .introduce .detail .box2 ul > li {padding:0 0 10px 0;text-align:left;} #section6 .element .introduce .detail .box2 ul > li .icon {display:inline-block;vertical-align:middle;} #section6 .element .introduce .detail .box2 ul > li .icon img {width:5vw;} #section6 .element .introduce .detail .box2 ul > li .txt {display:inline-block;vertical-align:middle;padding:0 0 0 2vw;color:#323232;font-size:3.5vw;} #section6 .element .introduce .summary {position:absolute;left:0;display:inline-block;width:100vw;margin:-80vw auto 0 auto;padding:0 0 0 0;text-align:center;background:transparent;} #section6 .element .introduce .summary .title {display:inline-block;} #section6 .element .introduce .summary .title1 {color:#ffffff;margin-top:0;font-size:5vw;} #section6 .element .introduce .summary .title1 b {color:#ffffff;margin-top:0;font-size:5vw;font-family:"NEXON Lv2 Gothic Bold";} #section6 .element .introduce .summary .title2 {opacity:0;display:block;color:#acd4f9;margin-top:4vw;font-size:7vw;letter-spacing:-7vw;font-family:"NEXON Lv2 Gothic Bold";} #section6 .element .introduce .summary .title2.on {opacity:1;letter-spacing:0;transition:all 1s;} #section6 .element .introduce .summary .title3 {color:#fff06e;font-size:4vw;margin:4vw 0 0 0;padding:0 0 0 0;width:40vw;border:0.3vw solid #fff06e;text-align:center;line-height:7vw;} #section6 .element .introduce .summary .visual {} #section6 .element .introduce .summary .visual .item1 {} #section6 .element .introduce .summary .visual .item2 {} #section6 .element .introduce .summary .visual .item3 {} #section6 .element .introduce .summary .visual .item img {position:absolute;} #section6 .element .introduce .summary .visual .item1 img {left:0;z-index:60;width:35vw;margin:5vw 0 0 27vw;} #section6 .element .introduce .summary .visual .item2 img {left:0;z-index:70;width:15vw;margin:12vw 0 0 53vw;} #section7 {display:;} #section7 .section_group {} #section7 .element {} #section7 .element .introduce:before {display:block;height:10vw;content:"";} #section7 .element .introduce {text-align:center;} #section7 .element .introduce dl {} #section7 .element .introduce dl > dt {} #section7 .element .introduce dl > dt .line1 {margin:0 0 0 0;color:#333333;font-size:5vw;} #section7 .element .introduce dl > dt .line2 {opacity:0;display:block;margin:4vw 0 0 0;color:#3b6aab;font-size:7vw;letter-spacing:-7vw;font-family:"NEXON Lv2 Gothic Bold";} #section7 .element .introduce dl > dt .line2.on {opacity:1;letter-spacing:0;transition:all 1s;} #section7 .element .introduce dl > dt .line3 {margin:4vw auto 0 auto;width:80vw;color:#333333;font-size:4vw;line-height:5.5vw;} #section7 .element .introduce dl > dt .line3 b{font-size:4vw;font-family:"NEXON Lv2 Gothic Bold";} #section7 .element .introduce dl > dd {text-align:center;padding:0 0 7vw 0;} #section7 .element .introduce dl > dd:before {display:block;content:"";height:7vw;} #section7 .element .introduce dl > dd .director {position:relative;display:inline-block;width:80vw;margin:0 auto 0 auto;padding:5vw 0 5vw 5vw;text-align:left;} #section7 .element .introduce dl > dd .director .visual {text-align:center;} #section7 .element .introduce dl > dd .director .visual img {} #section7 .element .introduce dl > dd .director .simbol {position:absolute;z-index:90;width:80vw;text-align:right;} #section7 .element .introduce dl > dd .director .simbol img {width:30%;margin:-5vw -7vw 0 0;} #section7 .element .introduce dl > dd .director .card {} #section7 .element .introduce dl > dd .director .card .position {display:inline-block;color:#ffffff;font-size:7vw;} #section7 .element .introduce dl > dd .director .card .name {display:inline-block;color:#ffffff;font-size:7vw;font-family:"NEXON Lv2 Gothic Bold";padding:0 0 0 3vw;} #section7 .element .introduce dl > dd .history {margin:5vw 0 0 0;} #section7 .element .introduce dl > dd .history ul {} #section7 .element .introduce dl > dd .history ul > li {color:#ffffff;font-size:3.5vw;line-height:4vw;margin:0 0 1.5vw 0;} #section7 .element .introduce dl > dd .director1 {background:#3b6aab;margin:70vw 0 0 0;} #section7 .element .introduce dl > dd .director1 .visual {} #section7 .element .introduce dl > dd .director1 .visual img {position:absolute;left:0;z-index:10;width:45vw;margin:-79vw 0 0 22vw;} #section7 .element .introduce dl > dd .director2 {background:#222a35;margin:90vw 0 0 0;} #section7 .element .introduce dl > dd .director2 .visual {} #section7 .element .introduce dl > dd .director2 .visual img {position:absolute;left:0;z-index:10;width:61vw;margin:-74.2vw 0 0 14vw;} #section8 {display:;} #section8 .section_group {} #section8 .element {} #section8 .element .introduce:before {display:block;height:10vw;content:"";} #section8 .element .introduce {text-align:center;} #section8 .element .introduce dl {} #section8 .element .introduce dl > dt {} #section8 .element .introduce dl > dt .line1 {margin:0 0 0 0;color:#ffffff;font-size:5vw;} #section8 .element .introduce dl > dt .line2 {margin:3vw 0 0 0;color:#ffffff;font-size:7vw;font-family:"NEXON Lv2 Gothic Bold";} #section8 .element .introduce dl > dt .line3 {opacity:0;margin:7vw 0 0 0;color:#acd4f9;font-size:7vw;letter-spacing:-7vw;font-family:"High Summit";} #section8 .element .introduce dl > dt .line3.on {opacity:1;letter-spacing:0;transition:all 1s;} #section8 .element .introduce dl > dt .line4 {margin:5vw auto 0 auto;color:#ffffff;font-size:3.5vw;line-height:4.5vw;width:86vw;} #section8 .element .introduce dl > dt .line4 b {color:#ffffff;font-size:3.5vw;font-family:"NEXON Lv2 Gothic Bold";} #section8 .element .introduce dl > dt .line4 br {display:none;} #section8 .element .introduce dl > dd {text-align:center;padding:0 0 3vw 0;} #section8 .element .introduce dl > dd:before {display:block;content:"";height:7vw;} #section8 .element .introduce dl > dd .box {display:inline-block;90vw} #section8 .element .introduce dl > dd .box {} #section8 .element .introduce dl > dd .box ul {font-size:0;} #section8 .element .introduce dl > dd .box ul > li {display:inline-block;width:40vw;height:40vw;vertical-align:top;margin:0 5vw 5vw 0;background:white;border-radius:5vw 0 5vw 0;text-align:center;} #section8 .element .introduce dl > dd .box ul > li:nth-child(2n) {margin-right:0;} #section8 .element .introduce dl > dd .box ul > li:nth-child(1) {background:white;} #section8 .element .introduce dl > dd .box ul > li:nth-child(2) {background:#7db1df;} #section8 .element .introduce dl > dd .box ul > li:nth-child(3) {background:white;} #section8 .element .introduce dl > dd .box ul > li:nth-child(4) {background:#7db1df;} #section8 .element .introduce dl > dd .box ul > li:nth-child(5) {background:#7db1df;} #section8 .element .introduce dl > dd .box ul > li:nth-child(6) {background:white;} #section8 .element .introduce dl > dd .box ul > li:nth-child(7) {background:#7db1df;} #section8 .element .introduce dl > dd .box ul > li:nth-child(8) {background:white;} #section8 .element .introduce dl > dd .box ul > li:nth-child(1) span {color:#3b6aab;} #section8 .element .introduce dl > dd .box ul > li:nth-child(2) span {color:white;} #section8 .element .introduce dl > dd .box ul > li:nth-child(3) span {color:#3b6aab;} #section8 .element .introduce dl > dd .box ul > li:nth-child(4) span {color:white;} #section8 .element .introduce dl > dd .box ul > li:nth-child(5) span {color:white;} #section8 .element .introduce dl > dd .box ul > li:nth-child(6) span {color:#3b6aab;} #section8 .element .introduce dl > dd .box ul > li:nth-child(7) span {color:white;} #section8 .element .introduce dl > dd .box ul > li:nth-child(8) span {color:#3b6aab;} #section8 .element .introduce dl > dd .box ul > li .icon {display:inline-block;padding-top:4vw;display:;} #section8 .element .introduce dl > dd .box ul > li .icon img {width:10vw;} #section8 .element .introduce dl > dd .box ul > li .summary {display:inline-block;padding-top:3vw;width:100%;font-size:3.5vw;line-height:4.5vw;} #section8 .element .introduce dl > dd .box ul > li .title{display:inline-block;padding-top:3vw;width:100%;font-size:5vw;font-family:"NEXON Lv2 Gothic Bold";} #section9 {display:;} #section9 .section_group {} #section9 .element {} #section9 .element .introduce:before {display:block;height:10vw;content:"";} #section9 .element .introduce {text-align:center;} #section9 .element .introduce dl {} #section9 .element .introduce dl > dt {} #section9 .element .introduce dl > dt .line1 {margin:0 0 0 0;color:#26262;font-size:7vw;line-height:8vw;font-family:"NEXON Lv2 Gothic Bold";letter-spacing:-0.4vw;} #section9 .element .introduce dl > dt .line1 span {display:none;} #section9 .element .introduce dl > dt .line1 em {opacity:0;color:#3b6aab;font-size:7vw;letter-spacing:-6vw;font-family:"NEXON Lv2 Gothic Bold";} #section9 .element .introduce dl > dt .line1 em.on {opacity:1;letter-spacing:0;transition:all 1s;} #section9 .element .introduce dl > dt .line2 {margin:3.5vw auto 0 auto;padding:2.5vw 1.5vw 1.5vw 1.5vw;width:86vw;color:#26262;font-size:3.5vw;line-height:5vw;border-top:0.3vw solid #000000;border-bottom:0.3vw solid #000000;background:#eeeeee;letter-spacing:-0.1vw;} #section9 .element .introduce dl > dt .line2 b {font-size:3.5vw;font-family:"NEXON Lv2 Gothic Bold";} #section9 .element .introduce dl > dt .line2 br {display:none;} #section9 .element .introduce dl > dt .line3 {margin:2.5vw auto 0 auto;width:86vw;color:#26262;font-size:3.5vw;line-height:5vw;letter-spacing:-0.1vw;} #section9 .element .introduce dl > dt .line3 b {font-size:3.5vw;font-family:"NEXON Lv2 Gothic Bold";} #section9 .element .introduce dl > dt .line3 br {display:none;} #section9 .element .introduce dl > dd {margin:10vw 0 7vw 0;text-align:center;} #section9 .element .introduce dl > dd .box {position:relative;z-index:100;display:inline-block;width:85vw;height:auto;background:white;border:1px solid #c0c0c0;} #section9 .element .introduce dl > dd .box .decoration {display:block;position:absolute;z-index:10;width:30vw;;height:30vw;background:transparent;font-size:0;} #section9 .element .introduce dl > dd .box .decoration1 {margin:0 0 0 54vw;border-top:1vw solid #b2b2b2;border-right:1vw solid #b2b2b2;} #section9 .element .introduce dl > dd .box .decoration2 {margin:-30vw 0 0 0;border-bottom:1vw solid #b2b2b2;border-left:1vw solid #b2b2b2;} #section9 .element .introduce dl > dd .box ul {font-size:0;margin:4vw 0 0 0;} #section9 .element .introduce dl > dd .box ul > li {display:inline-block;vertical-align:top;margin:0 5vw 5vw 0;} #section9 .element .introduce dl > dd .box ul > li:nth-child(2n) {margin-right:0;} #section9 .element .introduce dl > dd .box ul > li .license {} #section9 .element .introduce dl > dd .box ul > li .license img {width:33vw;border:0.5vw solid #f0f0f0;} #section10 {display:;} #section10 .section_group {} #section10 .element {} #section10 .element .introduce:before {display:block;height:10vw;content:"";} #section10 .element .introduce {text-align:center;} #section10 .element .introduce dl {} #section10 .element .introduce dl > dt {} #section10 .element .introduce dl > dt .line1 {margin:0 0 0 0;color:#ffffff;font-size:5vw;font-family:"NEXON Lv2 Gothic Bold";} #section10 .element .introduce dl > dt .line2 {margin:3vw 0 0 0;color:#ffffff;font-size:6vw;letter-spacing:-0.3vw;font-family:"NEXON Lv2 Gothic Bold";} #section10 .element .introduce dl > dt .line2 b {opacity:0;color:#9bcfff;font-size:6vw;letter-spacing:-6vw;font-family:"NEXON Lv2 Gothic Bold";} #section10 .element .introduce dl > dt .line2 b.on {opacity:1;letter-spacing:0;transition:all 1s;} #section10 .element .introduce dl > dt .line3 {width:80vw;margin:4vw auto 0 auto;color:#ffffff;font-size:4vw;line-height:5vw;} #section10 .element .introduce dl > dt .line3 b {color:#ffffff;font-size:4vw;font-family:"NEXON Lv2 Gothic Bold";} #section10 .element .introduce dl > dd {margin:55px 0 7vw 0;text-align:center;} #section10 .element .introduce dl > dd .box {display:inline-block;width:80vw;height:120vw;background:white;;} #section10 .element .introduce dl > dd .box .title {display:inline-block;margin:3vw 0 2vw 0;padding:2vw 0 2vw 0;width:75vw;background:#222a35;color:white;font-size:5vw;font-family:"NEXON Lv2 Gothic Bold";} #section10 .element .introduce dl > dd .box .slider {} #section10 .element .introduce dl > dd .box .slider .item {font-size:0;} #section10 .element .introduce dl > dd .box .slider .item .summary {display:block;vertical-align:top;width:80vw;margin:50vw 0 0 0;padding:5vw 0 0 5vw;text-align:left;background:transparent;} #section10 .element .introduce dl > dd .box .slider .item .summary .name {color:#3b6aab;font-size:6vw;font-family:"NEXON Lv2 Gothic Bold";} #section10 .element .introduce dl > dd .box .slider .item .summary .contents {height:23vw;margin:5vw 0 0 0;color:#343434;font-size:3.3vw;line-height:4.5vw;letter-spacing:-0.2vw;} #section10 .element .introduce dl > dd .box .slider .item .summary .step {color:#cccccc;font-size:5vw;font-family:"NEXON Lv2 Gothic Bold";} #section10 .element .introduce dl > dd .box .slider .item .visual {display:block;vertical-align:top;width:80vw;margin:-88vw 0 0 0;background:transparent;} #section10 .element .introduce dl > dd .box .slider .item .visual .line {position:absolute;z-index:20;display:block;margin:3vw 0 0 25vw;width:35vw;height:35vw;border:1px solid #cccccc;} #section10 .element .introduce dl > dd .box .slider .item .visual img {position:relative;z-index:30;width:35vw;height:35vw;margin:0 0 0 22vw;box-shadow:0 0 2vw gray;} #section11 {display:;} #section11 .section_group {} #section11 .element {} #section11 .element .introduce:before {display:block;height:10vw;content:"";} #section11 .element .introduce {text-align:center;} #section11 .element .introduce dl {} #section11 .element .introduce dl > dt {} #section11 .element .introduce dl > dt .line1 {margin:0 0 0 0;color:#333333;font-size:5vw;line-height:5vw;font-family:"NEXON Lv2 Gothic Bold";} #section11 .element .introduce dl > dt .line2 {margin:4vw 0 0 0;color:#333333;font-size:7vw;line-height:9vw;font-family:"NEXON Lv2 Gothic Bold";letter-spacing:-.3vw;} #section11 .element .introduce dl > dt .line2 b {color:#3d6aa9;font-size:7vw;font-family:"NEXON Lv2 Gothic Bold";} #section11 .element .introduce dl > dt .line2 b.point {opacity:0;letter-spacing:-7vw;} #section11 .element .introduce dl > dt .line2 b.point.on {opacity:1;letter-spacing:0;transition:all 1s;} #section11 .element .introduce dl > dd {margin:15vw 0 0 0;text-align:center;} #section11 .element .introduce dl > dd .box {} #section11 .element .introduce dl > dd .box ul {font-size:0;} #section11 .element .introduce dl > dd .box ul > li {display:inline-block;vertical-align:top;width:40vw;height:65vw;margin-right:5vw;} #section11 .element .introduce dl > dd .box ul > li:nth-child(2n) {margin-right:0;} #section11 .element .introduce dl > dd .box ul > li .step {position:relative;z-index:30;display:inline-block;width:10vw;height:10vw;background:#3d6aa9;color:white;font-size:4vw;line-height:10vw;border:0.5vw solid white;border-radius:50%;font-family:"NEXON Lv2 Gothic Bold";vertical-align:middle;} #section11 .element .introduce dl > dd .box ul > li img {position:relative;z-index:20;margin:-6vw 0 0 0;width:100%;height:auto;display:block;border:0.5vw solid #ffffff;} #section11 .element .introduce dl > dd .box ul > li .summary {display:inline-block;padding:3.3vw 0 0 0;color:#333333;font-size:3vw;line-height:5vw;} #section11 .element .introduce dl > dd .box ul > li .summary b {color:#000000;font-size:3vw;font-family:"NEXON Lv2 Gothic Bold";} #section12 {display:;} #section12 .section_group {} #section12 .element {} #section12 .element .introduce:before {display:block;height:10vw;content:"";} #section12 .element .introduce {text-align:center;} #section12 .element .introduce dl {} #section12 .element .introduce dl > dt {padding:0 0 0 0;} #section12 .element .introduce dl > dt .line1 {margin:0 0 0 0;color:#333333;font-size:5vw;line-height:5vw;font-family:"NEXON Lv2 Gothic Bold";} #section12 .element .introduce dl > dt .line2 {opacity:0;margin:3vw 0 0 0;color:#3b6aab;font-size:7vw;letter-spacing:-7vw;line-height:7vw;font-family:"NEXON Lv2 Gothic Bold";} #section12 .element .introduce dl > dt .line2.on {opacity:1;letter-spacing:0;transition:all 1s;} #section12 .element .introduce dl > dd {margin:7vw 0 0 0;text-align:center;} #section12 .element .introduce dl > dd .box {padding:0 0 2vw 0;} #section12 .element .introduce dl > dd .box .gallery .detail {display:inline-block;vertical-align:top;width:90vw;background:transparent;} #section12 .element .introduce dl > dd .box .gallery .detail img {width:88vw;height:auto;border:0.6vw solid white;} #section12 .element .introduce dl > dd .box .gallery .list {display:inline-block;width:90vw;margin:3vw 0 0 0;vertical-align:top;text-align:center;background:transparent;} #section12 .element .introduce dl > dd .box .gallery .list ul {font-size:0;background:transparent;} #section12 .element .introduce dl > dd .box .gallery .list ul > li {display:inline-block;margin:0 5vw 3vw 0;cursor:pointer;} #section12 .element .introduce dl > dd .box .gallery .list ul > li.on {-webkit-animation: drawLines 2s linear;-moz-animation: drawLines 1s linear;-o-animation: drawLines 1s linear;animation: drawLines 1s linear;} #section12 .element .introduce dl > dd .box .gallery .list ul > li:nth-child(2n) {margin-right:0;} #section12 .element .introduce dl > dd .box .gallery .list ul > li img {width:41vw;border:0.6vw solid white;} #section13 {display:;} #section13 .section_group {} #section13 .element {} #section13 .element .introduce:before {display:block;height:10vw;content:"";} #section13 .element .introduce {text-align:center;} #section13 .element .introduce dl {} #section13 .element .introduce dl > dt {} #section13 .element .introduce dl > dt .line1 {margin:0 0 0 0;color:white;font-size:5vw;line-height:5vw;font-family:"NEXON Lv2 Gothic Bold";} #section13 .element .introduce dl > dt .line2 {margin:3vw 0 0 0;color:white;font-size:7vw;line-height:7vw;font-family:"NEXON Lv2 Gothic Bold";} #section13 .element .introduce dl > dt .line2 b {opacity:0;color:#9bcfff;font-size:7vw;letter-spacing:-7vw;line-height:8vw;font-family:"NEXON Lv2 Gothic Bold";} #section13 .element .introduce dl > dt .line2 b.on {opacity:1;letter-spacing:0;transition:all 1s;} #section13 .element .introduce dl > dd {margin:7vw 0 7vw 0;text-align:center;} #section13 .element .introduce dl > dd .box1 {display:block;position:relative;left:0;margin:0;padding:0;width:90vw;margin:0 auto 0 auto;z-index:1000;} #section13 .element .introduce dl > dd .inner_gorup1 {width:90vw;margin:0 auto 0 auto;padding:0 0 0 0;} #section13 .element .introduce dl > dd .inner_gorup1 .map {display:block;width:90vw;height:60vw;background:#ffffff;} #section13 .element .introduce dl > dd .inner_gorup1 .schedule {display:block;width:90vw;margin:7vw auto;text-align:left;} #section13 .element .introduce dl > dd .inner_gorup1 .schedule .title {text-align:center;padding:3vw 0 3vw 0;background:rgba(0,0,0,0.8);} #section13 .element .introduce dl > dd .inner_gorup1 .schedule .title .icon {display:inline-block;vertical-align:middle;} #section13 .element .introduce dl > dd .inner_gorup1 .schedule .title .icon img {width:8vw;} #section13 .element .introduce dl > dd .inner_gorup1 .schedule .title .txt {display:inline-block;vertical-align:middle;padding:0 0 0 2vw;font-size:6vw;color:#9bcfff;font-family:"NEXON Lv2 Gothic Bold";} #section13 .element .introduce dl > dd .inner_gorup1 .schedule ul {margin:0 0 3vw 0;background:rgba(0,0,0,0.3);border-top:0 solid #61738e;border-bottom:0 solid #61738e;} #section13 .element .introduce dl > dd .inner_gorup1 .schedule ul > li {line-height:8vw;text-align:center;} #section13 .element .introduce dl > dd .inner_gorup1 .schedule ul > li:first-child {padding-top:2vw;} #section13 .element .introduce dl > dd .inner_gorup1 .schedule ul > li:last-child {padding-bottom:1vw;} #section13 .element .introduce dl > dd .inner_gorup1 .schedule ul > li .week {display:inline-block;margin:1vw 0 0 -5vw;width:28vw;color:white;font-size:5vw;font-family:"NEXON Lv2 Gothic Bold";letter-spacing:1vw;} #section13 .element .introduce dl > dd .inner_gorup1 .schedule ul > li .time {color:#ffffff;font-size:4.5vw;} #section13 .element .introduce dl > dd .inner_gorup1 .schedule .addtional {margin:-3vw 0 0 0;padding:2vw 0 4vw 0;background:rgba(0,0,0,0.3);color:white;font-size:3.5vw;line-height:5vw;text-align:center} #section13 .element .introduce dl > dd .box2 {display:block;margin:0 0 0 0;} #section13 .element .introduce dl > dd .box2 .icon img {width:7vw;} #section13 .element .introduce dl > dd .inner_gorup2 {width:90vw;margin:7vw auto 0 auto;background:transparent;} #section13 .element .introduce dl > dd .inner_gorup2 .location {display:block;width:90vw;} #section13 .element .introduce dl > dd .inner_gorup2 .location ul {} #section13 .element .introduce dl > dd .inner_gorup2 .location ul > li {display:block;padding:3vw 0 0 0;background:rgba(0,0,0,0.8);margin:0 0 5vw 0;} #section13 .element .introduce dl > dd .inner_gorup2 .location .icon {display:inline-block;vertical-align:middle;} #section13 .element .introduce dl > dd .inner_gorup2 .location .icon img {width:10vw;} #section13 .element .introduce dl > dd .inner_gorup2 .location .item_name {display:inline-block;vertical-align:middle;color:#9bcfff;font-size:6vw;width:25vw;padding:0 0 1vw 3vw;font-family:"NEXON Lv2 Gothic Bold";text-align:left;} #section13 .element .introduce dl > dd .inner_gorup2 .location .item_contents {display:block;vertical-align:middle;color:white;font-size:4vw;margin:3vw 0 0 0;padding:0 0 4vw 0;width:90vw;line-height:6vw;background:rgba(0,0,0,0.5);} #section13 .element .introduce dl > dd .inner_gorup2 .contract {display:inline-block;width:90vw;text-align:center;} #section13 .element .introduce dl > dd .inner_gorup2 .contract .icon {display:inline-block;vertical-align:middle;} #section13 .element .introduce dl > dd .inner_gorup2 .contract .icon img {width:10vw;} #section13 .element .introduce dl > dd .inner_gorup2 .contract .item_name {display:inline-block;vertical-align:middle;color:#9bcfff;font-size:6vw;width:25vw;padding:0 0 0 3vw;font-family:"NEXON Lv2 Gothic Bold";text-align:left;} #section13 .element .introduce dl > dd .inner_gorup2 .contract .item_contents {display:block;padding:3vw 0 0;} #section13 .element .introduce dl > dd .inner_gorup2 .contract .item_contents a {color:white;font-size:8vw;font-family:"NEXON Lv2 Gothic Bold";padding:0 0 0 0;} #section14 {background:black !important;} #section14 .section_group {} #section14 .logo {display:none;} #section14 .information {background:black !important;width:95%;margin:0 auto 2vw auto;padding:3vw 0 0 0;text-align:left;} #section14 .information span {color:white;font-size:3vw;line-height:6vw;letter-spacing:-0.2vw;} #gnb {display:} #section1 {display:;} #section2 {display:;} #section3 {display:;} #section4 {display:;} #section5 {display:;} #section6 {display:;} #section7 {display:;} #section8 {display:;} #section9 {display:;} #section10 {display:;} #section11 {display:;} #section12 {display:;} #section13 {display:;} #section14 {display:;} /* 비급여 진료 수가표 */ #section14 .information span.price_table { display: inline-block; border: 1px solid white; padding: 2px 4px; margin-left: 10px; cursor: pointer; } #section14 .price_tableWrap { position: fixed; left: 0; bottom: 0; width: 100vw; height: 100vh; background-color: rgba(0, 0, 0, 0.7); z-index: 99999; display: none; } #section14 .price_tableWrap .content_wrap { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; flex-direction: column; gap: 3vw; justify-content: center; align-items: center; width: 100%; } #section14 .price_tableWrap .content_wrap .btn-close { position: absolute; right: 10vw; top: 0; display: block; width: 5vw; height: 5vw; font-size: 5vw; font-weight: bold; color: white; cursor: pointer; } #section14 .price_tableWrap .content_wrap img { width: 60%; } } /*-------------------------------------------------------------------- ||PC --------------------------------------------------------------------*/ @media screen and (min-width: 768px){ #inquiryAgreePopup {display:none;position:fixed;z-index:100000;top:0;width:100%;height:100%;background:rgba(0,0,0,0.8);text-align:center;} #inquiryAgreePopup .contents {padding:10px;width:950px;height:700px;overflow-x:hidden;overflow-y:scroll;text-align:left;margin:70px auto 0 auto;background:white;font-size:12px;line-height:16px;font-weight:400;color:#777777;} #inquiryAgreePopup .contents b {color:#333333;font-size:14px;font-family:'NEXON Lv2 Gothic Bold';font-weight:400;} #inquiryAgreePopup .button {padding:10px;width:950px;background:#f0c757;margin:0 auto;} #inquiryAgreePopup .button a {color:white;font-size:14px;font-weight:bold;} #section1 {background-image:url('/resource/image/home/bg1.jpg'); background-repeat:no-repeat;background-size:cover;background-position:left top;} #section2 {background-image:url('/resource/image/home/bg2.jpg'); background-repeat:no-repeat;background-size:cover;background-position:left top;} #section3 {background-image:url('/resource/image/home/bg3.jpg'); background-repeat:no-repeat;background-size:cover;background-position:left top;} #section4 {background-image:url('/resource/image/home/bg4.jpg'); background-repeat:no-repeat;background-size:cover;background-position:left top;} #section5 {background-image:url('/resource/image/home/bg5.jpg'); background-repeat:no-repeat;background-size:cover;background-position:left top;} #section6 {background-image:url('/resource/image/home/bg6.jpg'); background-repeat:no-repeat;background-size:cover;background-position:left top;} #section7 {background-image:url('/resource/image/home/bg7.jpg'); background-repeat:no-repeat;background-size:cover;background-position:left top;} #section8 {background-image:url('/resource/image/home/bg8.jpg'); background-repeat:no-repeat;background-size:cover;background-position:left top;} #section9 {background-image:url('/resource/image/home/bg9.jpg'); background-repeat:no-repeat;background-size:cover;background-position:left top;} #section10 {background-image:url('/resource/image/home/bg10.jpg'); background-repeat:no-repeat;background-size:cover;background-position:left top;} #section11 {background-image:url('/resource/image/home/bg11.jpg'); background-repeat:no-repeat;background-size:cover;background-position:left center;} #section12 {background-image:url('/resource/image/home/bg12.jpg'); background-repeat:no-repeat;background-size:cover;background-position:left top;} #section13 {background-image:url('/resource/image/home/bg13.jpg'); background-repeat:no-repeat;background-size:cover;background-position:left top;} body {} #wrap {} #wrap .width_area {width:1270px;margin:0 auto;background:transparent;} #wrap .width_area:after {display:block;clear:both;content:"";} #movie {display:none;position:absolute;z-index:50;width:100vw;text-align:center;margin:200px 0 0 0;} #movie .player {} #movie .player iframe {border:5px solid black;} #movie .function {display:block;width:1000px;margin:-5px auto 0 auto;background:black;padding:20px 0 20px 0;text-align:center;border:5px solid black;} #movie .function a {font-size:24px;color:white;} #quick {} #quick .link {position:fixed;z-index:100;;margin:220px 0 0 1800px;display:;} #quick .link ul {font-size:0;background:white;border:1px solid #d9dfe0;} #quick .link ul > li {width:78px;height:60px;padding:10px 0 10px 0;display:block;margin-right:0x;margin:0 0 0 0;} #quick .link ul > li .icon {padding:0 0 0 0;display:block;text-align:center;} #quick .link ul > li .icon img {width:20px;} #quick .link ul > li .text {padding:5px 0 0 0;display:block;font-size:13px;line-height:16px;color:white;text-align:center;} #quick .link ul > li:nth-child(1) {background:#ffffff;height:125px;text-align:center;} #quick .link ul > li:nth-child(2) {background:#365c53;} #quick .link ul > li:nth-child(3) {background:#5e8562;} #quick .link ul > li:nth-child(4) {background:#47654a;} #quick .link ul > li:nth-child(5) {background:linear-gradient(50deg, #c035a8, #783dba);} #quick .link ul > li:nth-child(6) {background:#f0c757;} #quick .link ul > li:nth-child(7) {background:#252d39;} #quick .link ul > li:nth-child(8) {background:#ffffff;text-align:center;height:20px;padding:7px 0 5px 0;} #quick .link ul > li:nth-child(8) a {color:#000000;color:;font-size:16px;font-family:"NEXON Lv2 Gothic Bold";} #quick .link ul > li:nth-child(1) .icon {display:inline-block;width:36px;height:36px;margin:0 auto;background:#2e75b6;border-radius:50%;line-height:36px;} #quick .link ul > li:nth-child(1) .icon img {vertical-align:middle;} #quick .link ul > li:nth-child(1) .text {} #quick .link ul > li:nth-child(1) .text i {display:block;font-style:normal;font-size:24px;line-height:24px;color:red;font-family:"NEXON Lv2 Gothic Bold";} #quick .link ul > li:nth-child(1) .text i:nth-child(1) {color:#000000;margin:3px 0 0 0;} #quick .link ul > li:nth-child(1) .text i:nth-child(2) {color:#9dc3e6;} #quick .link ul > li:nth-child(1) .text i:nth-child(3) {color:#2e75b6;} #quick .link ul > li:nth-child(6) .text {color:#000000;} #inquiry {display:block;position:absolute;z-index:10000;width:100%;top:0;left:0;background:#f0c757;} #inquiry .box {padding:15px 0 15px 0;} #inquiry .box {width:1270px;margin:0 auto 0 auto;} #inquiry .box .title {display:inline-block;vertical-align:middle;width:440px;text-align:left;} #inquiry .box .title .subject {display:block;padding:0 0 0 0;font-family:"NEXON Lv2 Gothic Bold";color:#55474c;font-size:36px;letter-spacing:-1px;} #inquiry .box .title .description {display:block;padding:7px 0 0 0;font-family:"NEXON Lv2 Gothic";color:#55474c;font-size:16px;letter-spacing:0;display:none;} #inquiry .box .form {display:inline-block;vertical-align:middle;width:500px;text-align:left;background:transparent;} #inquiry .box .form .item {font-size:0;display:inline-block;} #inquiry .box .form .item.text {} #inquiry .box .form .item.text input {width:190px;height:32px;padding:0 0 0 10px;font-size:15px;font-family:"NEXON Lv2 Gothic";color:white;background:#55474c;border:0 solid #55474c;} #inquiry .box .form .item.select {} #inquiry .box .form .item.select select {width:280px;height:32px;padding:0 0 0 10px;border:0 solid #55474c;font-size:15px;font-family:"NEXON Lv2 Gothic";color:white;background:#55474c;border:0 solid #55474c;} #inquiry .box .form .item.select select { background: url('/resource/image/common/select_arrow.jpg') no-repeat 95% 50%; background-color:#55474c; border-radius: 0px; -webkit-appearance: none; -moz-appearance: none; appearance: none; } select::-ms-expand { display:none; display:hidden; } #inquiry .box .form .item.text.phone {padding-top:7px;} #inquiry .box .form .item.text.quantity {padding-top:7px;} #inquiry .box .funciton {display:inline-block;vertical-align:middle;text-align:left;background:blue;} #inquiry .box .funciton button {background:#55474c;width:100px;height:70px;font-family:"NEXON Lv2 Gothic Bold";color:white;font-size:19px;text-align:center;border:0;} #inquiry .box .check {display:inline-block;padding:0 0 0 10px;vertical-align:middle;width:200px;text-align:left;} #inquiry .box .check .item {} #inquiry .box .check .text label {font-family:"NEXON Lv2 Gothic Bold";font-size:17px;} #inquiry .box .check .description {display:inline-block;font-size:14px;padding:7px 0 0 18px;} #inquiry .box .check a {display:inline-block;color:black;padding:10px 0 0 20px;font-weight:bold;font-family:"NEXON Lv2 Gothic Bold";} #header {} #gnb {position:fixed;z-index:100;width:100%;background:rgba(256, 256, 256, 1);box-shadow:0 1px 20px rgba(0,0,0,.1);margin-top:100px;} #gnb .gnb_group {font-size:0;} #gnb .logo_area {display:inline-block;width:380px;height:93px;background:transparent;} #gnb .logo_area:before {display:inline-block;height:100%;vertical-align:middle;content:"";} #gnb .logo_area img {width:138px;vertical-align:middle;} #gnb .menu_area {display:inline-block;width:890px;vertical-align:middle;background:transparent;text-align:left;} #gnb .menu_area ul,li {font-size:0;margin:0;padding:0;} #gnb .menu_area li {display:inline-block;background:transparent;} #gnb .menu_area li:after {display:inline-block;width:75px;content:"";font-size:25px;color:#585858;text-align:center;} #gnb .menu_area li:last-child:after {display:none;} #gnb .menu_area a {font-size:20px;color:#000000;font-family:"NEXON Lv2 Gothic Medium";} #gnb .menu_area .linkOn a {font-size:20px;color:#4171ba;transition:all .8s;} #gnb .menu_area .linkOff a {font-size:20px;color:#585858;} #container {} #container .section.default {height:100vh;} #section1 {display:;} #section1 .section_group {} #section1 .visual {display:block;width:100%;height:100vh;position:absolute;left:0;overflow:hidden;} #section1 .visual .visual1 {position:absolute;z-index:100;margin:100vh 0 0 100vw;} #section1 .visual .visual1 img {position:absolute;margin:-730px 0 0 -36vw;opacity:0.6;} #section1 .visual .visual2 {position:absolute;z-index:95;margin:300px 0 0 100vw;opacity:0;} #section1 .visual .visual2.on {opacity:1;transition:all 2s;} #section1 .visual .visual2 .box {margin:0 0 0 -350px;} #section1 .visual .visual2 .card {} #section1 .visual .visual2 .card .position {display:inline-block;font-size:20px;color:white;} #section1 .visual .visual2 .card .name {display:inline-block;font-size:20px;color:white;font-family:"NEXON Lv2 Gothic Bold";padding:0 0 0 5px;} #section1 .visual .visual2 .sign {color:white;font-size:30px;font-family:"High Summit";padding:15px 0 0 0;} #section1 .element {position:relative;z-index:30;} #section1 .element .introduce:before {display:block;height:35vh;content:"";} #section1 .element .introduce {} #section1 .element .introduce dl {} #section1 .element .introduce dl > dt {} #section1 .element .introduce dl > dt .line1 {} #section1 .element .introduce dl > dt .line1 .inBox {opacity:0.8;font-size:30px;color:#ffffff;width:780px;padding:15px 0 15px 0;text-align:center;background:transparent;} #section1 .element .introduce dl > dt .line1 .inBox b {font-size:30px;color:#b2d2f0;font-family:"NEXON Lv2 Gothic Bold";} #section1 .element .introduce dl > dt .line1 .on {opacity:1;background:linear-gradient(90deg, #244565, #042b50);background-repeat:no-repeat;-webkit-animation: progress 0.3s linear;-moz-animation: progress 0.3s linear;-o-animation: progress 0.3s linear;animation: progress 0.3s linear;} #section1 .element .introduce dl > dt .line2 {font-size:85px;line-height:95px;color:#ffffff;font-family:"NEXON Lv2 Gothic Bold";margin:35px 0 0 0;letter-spacing:-4px;} #section1 .element .introduce dl > dt .line2 b {font-size:85px;color:#cce7ff;font-family:"NEXON Lv2 Gothic Bold";} #section1 .element .introduce dl > dd {} #section1 .element .introduce dl > dd:before {display:block;content:"";height:60px;} #section1 .element .introduce dl > dd .box {} #section1 .element .introduce dl > dd .box .description1 {} #section1 .element .introduce dl > dd .box .description1 .inBox {width:820px;color:#ffffff;font-size:26px;line-height:34px;} #section1 .element .introduce dl > dd .box .description1 .inBox {opacity:0.8;padding:14px 0 14px 20px;background:transparent;} #section1 .element .introduce dl > dd .box .description1 .on {opacity:1;background:linear-gradient(90deg, #4286bf, transparent);background-repeat:no-repeat;-webkit-animation: progress 0.5s linear;-moz-animation: progress 0.5s linear;-o-animation: progress 0.5s linear;animation: progress 0.5s linear;} #section2 {display:;} #section2 .section_group {} #section2 .element {position:relative;z-index:30;} #section2 .element .introduce:before {display:block;height:23.14vh;max-height:250px;content:"";} #section2 .element .introduce {text-align:center;} #section2 .element .introduce dl {} #section2 .element .introduce dl > dt {} #section2 .element .introduce dl > dt .line1 {color:#000000;font-size:39px;} #section2 .element .introduce dl > dt .line1 b {color:#000000;font-size:39px;font-family:"NEXON Lv2 Gothic Bold";} #section2 .element .introduce dl > dt .line2 {margin:20px 0 0 0;color:#000000;font-size:40px;} #section2 .element .introduce dl > dt .line2 em {color:#000000;font-size:40px;font-family:"NEXON Lv2 Gothic Bold";} #section2 .element .introduce dl > dt .line2 b {color:#3d6aa9;font-size:57px;font-family:"NEXON Lv2 Gothic Bold";letter-spacing:-57px;opacity:0;} #section2 .element .introduce dl > dt .line2 b.on {letter-spacing:0;opacity:1;transition:all 1s;} #section2 .element .introduce dl > dt .line3 i {display:inline-block;height:40px;margin:35px 0 35px 0;border-right:1px solid #333333;font-size:0;} #section2 .element .introduce dl > dt .line4 {color:#000000;font-size:30px;line-height:46px;} #section2 .element .introduce dl > dt .line4 b {color:#3d6aa9;font-size:30px;font-family:"NEXON Lv2 Gothic Bold";} #section2 .element .introduce dl > dt .line4 em {color:#000000;font-size:30px;font-family:"NEXON Lv2 Gothic Bold";} #section2 .element .introduce dl > dd {} #section2 .element .introduce dl > dd:before {display:block;content:"";height:70px;} #section2 .element .introduce dl > dd .box {} #section2 .element .introduce dl > dd .box .description1 {} #section2 .element .introduce dl > dd .box .description1 ul {font-size:0;} #section2 .element .introduce dl > dd .box .description1 ul > li {width:381px;height:214px;display:inline-block;margin-right:28px;overflow:hidden;} #section2 .element .introduce dl > dd .box .description1 ul > li:last-child {margin-right:0;} #section2 .element .introduce dl > dd .box .description1 ul > li img {opacity:0;margin:208px 0 0 0;width:375px;height:auto;border:3px solid white;} #section2 .element .introduce dl > dd .box .description1 ul > li.on:nth-child(1) img {opacity:1;margin:0 0 0 0;transition:all 0.3s 0s;} #section2 .element .introduce dl > dd .box .description1 ul > li.on:nth-child(2) img {opacity:1;margin:0 0 0 0;transition:all 0.6s 0.1s;} #section2 .element .introduce dl > dd .box .description1 ul > li.on:nth-child(3) img {opacity:1;margin:0 0 0 0;transition:all 0.9s 0.2s;} #section3 {display:;} #section3 .section_group {} #section3 .element {position:relative;z-index:30;} #section3 .element .introduce:before {display:block;height:23.14vh;max-height:250px;content:"";} #section3 .element .introduce {font-size:0;text-align:center;background:transparent;} #section3 .element .introduce .summary {display:inline-block;vertical-align:top;width:530px;padding:0 0 0 0x;text-align:left;background:transparent;} #section3 .element .introduce .summary .title {display:inline-block;} #section3 .element .introduce .summary .title1 {color:#ffffff;margin-top:0;font-size:30px;} #section3 .element .introduce .summary .title1 b {color:#ffffff;margin-top:0;font-size:30px;font-family:"NEXON Lv2 Gothic Bold";} #section3 .element .introduce .summary .title2 {color:#acd4f9;margin-top:20px;font-size:46px;font-family:"NEXON Lv2 Gothic Bold";} #section3 .element .introduce .summary .title3 {color:#fff06e;margin-top:50px;font-size:24px;padding:5px 0 3px 0;width:185px;border:1px solid #fff06e;text-align:center;line-height:24px;} #section3 .element .introduce .summary .visual {} #section3 .element .introduce .summary .visual .item1 {display:none;} #section3 .element .introduce .summary .visual .item2 {} #section3 .element .introduce .summary .visual .item3 {} #section3 .element .introduce .summary .visual .item img {position:absolute;} #section3 .element .introduce .summary .visual .item1 img {z-index:60;margin:-20px 0 0 280px;} #section3 .element .introduce .summary .visual .item2 img {z-index:50;margin:70px 0 0 0;} #section3 .element .introduce .summary .visual .item3 img {z-index:60;margin:180px 0 0 300px;} #section3 .element .introduce .detail {display:inline-block;vertical-align:top;width:550px;padding:0 0 0 80px;text-align:left;background:transparent;} #section3 .element .introduce .detail .title {opacity:0;display:block;padding:0 0 0 0;color:#3b6aab;font-size:34px;letter-spacing:-34px;font-family:"NEXON Lv2 Gothic Bold";} #section3 .element .introduce .detail .title.on {opacity:1;letter-spacing:0;transition:all 0.6s;} #section3 .element .introduce .detail .description {display:inline-block;padding:24px 0 0 0;color:#323232;font-size:27px;line-height:36px;} #section3 .element .introduce .detail .description b {padding:24px 0 0 0;color:#323232;font-size:27px;font-family:"NEXON Lv2 Gothic Bold";} #section3 .element .introduce .detail .box1 {margin:45px 0 0 0;} #section3 .element .introduce .detail .box1 ul {} #section3 .element .introduce .detail .box1 ul > li {padding:0 0 10px 0;} #section3 .element .introduce .detail .box1 ul > li .icon {display:inline-block;vertical-align:middle;} #section3 .element .introduce .detail .box1 ul > li .icon img {width:27px;} #section3 .element .introduce .detail .box1 ul > li .txt {display:inline-block;vertical-align:middle;color:#323232;font-size:24px;padding:0 0 0 10px;;} #section3 .element .introduce .detail .box2 {margin:80px 0 0 0;width:525px;height:180px;background:#ffffff;} #section3 .element .introduce .detail .box2 .subTitle {display:inline-block;background:#3b6aab;margin:-20px 0 0 0;padding:7px 10px 3px 10px;color:white;font-size:21px;} #section3 .element .introduce .detail .box2 .subTitle b {display:inline-block;color:#fff06e;font-size:21px;font-family:"NEXON Lv2 Gothic Bold";} #section3 .element .introduce .detail .box2 ul {margin:20px 0 0 20px;} #section3 .element .introduce .detail .box2 ul > li {padding:0 0 10px 0;} #section3 .element .introduce .detail .box2 ul > li .icon {display:inline-block;vertical-align:middle;} #section3 .element .introduce .detail .box2 ul > li .icon img {width:22px;} #section3 .element .introduce .detail .box2 ul > li .txt {display:inline-block;vertical-align:middle;padding:0 0 0 10px;color:#323232;font-size:21px;} #section4 {display:;} #section4 .section_group {} #section4 .element {position:relative;z-index:30;} #section4 .element .introduce:before {display:block;height:26.20vh;max-height:175px;content:"";} #section4 .element .introduce {text-align:center;} #section4 .element .introduce dl {} #section4 .element .introduce dl > dt {} #section4 .element .introduce dl > dt .line1 {color:#ffffff;font-size:35px;} #section4 .element .introduce dl > dt .line1 em {opacity:0;color:#acd4f9;font-size:45px;letter-spacing:-45px;font-family:"NEXON Lv2 Gothic Bold";} #section4 .element .introduce dl > dt .line1 em.on {opacity:1;letter-spacing:0;transition:all 0.6s;} #section4 .element .introduce dl > dt .line2 {margin:25px 0 0 0;color:#ffffff;font-size:26px;line-height:40px;} #section4 .element .introduce dl > dt .line2 b {color:#fff06e;font-size:26px;font-family:"NEXON Lv2 Gothic Bold";} #section4 .element .introduce dl > dt .line2 em {display:inline-block;background:transparent;padding:0 5px 0 5px;color:white;font-size:26px;font-family:"NEXON Lv2 Gothic Bold";} #section4 .element .introduce dl > dt .line2 em.on {color:#222a35;opacity:1;background:linear-gradient(90deg, #acd4f9, #5f9fd9);background-repeat:no-repeat;-webkit-animation: progress 0.3s linear;-moz-animation: progress 0.3s linear;-o-animation: progress 0.3s linear;animation: progress 0.3s linear;animation-delay: 1.5s;} #section4 .element .introduce dl > dt .line2 p {display:none;} #section4 .element .introduce dl > dd {} #section4 .element .introduce dl > dd:before {display:block;content:"";height:65px;} #section4 .element .introduce dl > dd .box {background:rgba(0,0,0,0.3);width:1170px;min-height:440px;text-align:center;} #section4 .element .introduce dl > dd .box .process .item {height:280px;padding:30px 0 0 0;background:white;} #section4 .element .introduce dl > dd .box .process .item ul {font-size:0;} #section4 .element .introduce dl > dd .box .process .item ul > li {display:inline-block;margin-right:16px;text-align:center;} #section4 .element .introduce dl > dd .box .process .item ul > li:last-child {margin-right:0;} #section4 .element .introduce dl > dd .box .process .item ul > li .visual {} #section4 .element .introduce dl > dd .box .process .item ul > li .visual img {width:207px;height:auto;border:1px solid #cccccc;} #section4 .element .introduce dl > dd .box .process .item ul > li .step {display:inline-block;margin:-20px 0 0 0;background:#222a35;width:70px;height:28px;color:white;font-size:20px;line-height:28px;font-family:"NEXON Lv2 Gothic Bold";border:1px solid #ffffff;} #section4 .element .introduce dl > dd .box .process .item ul > li .summary {margin:15px 0 0 0;color:#333333;font-size:19px;line-height:25px;font-family:"NEXON Lv2 Gothic Bold";} #section4 .element .introduce dl > dd .box .process .article {display:block;margin:30px 0 0 0;width:100%;} #section4 .element .introduce dl > dd .box .process .article table {width:100%;} #section4 .element .introduce dl > dd .box .process .article td {} #section4 .element .introduce dl > dd .box .process1 {display:inline-block;width:735px;padding:40px 0 0 0;vertical-align:top;} #section4 .element .introduce dl > dd .box .process1 .article .left {width:20%;border-left:1px solid #ffffff;} #section4 .element .introduce dl > dd .box .process1 .article .left span {display:block;width:100%;height:1px;background:white;font-size:0;} #section4 .element .introduce dl > dd .box .process1 .article .center {color:#fff06e;font-size:21px;} #section4 .element .introduce dl > dd .box .process1 .article .right {width:20%;border-right:1px solid #ffffff;} #section4 .element .introduce dl > dd .box .process1 .article .right span {display:block;width:100%;height:1px;background:white;font-size:0;} #section4 .element .introduce dl > dd .box .process2 {display:inline-block;width:275px;padding:40px 0 0 40px;vertical-align:top;} #section4 .element .introduce dl > dd .box .process2 .article .left {width:1%;border-left:1px solid #ffffff;} #section4 .element .introduce dl > dd .box .process2 .article .left span {display:block;width:100%;height:0px;background:white;font-size:0;} #section4 .element .introduce dl > dd .box .process2 .article .center {color:#fff06e;font-size:21px;} #section4 .element .introduce dl > dd .box .process2 .article .right {width:1%;border-right:1px solid #ffffff;} #section4 .element .introduce dl > dd .box .process2 .article .right span {display:block;width:100%;height:0px;background:white;font-size:0;} #section5 {display:;} #section5 .section_group {} #section5 .element {position:relative;z-index:30;} #section5 .element .introduce:before {display:block;height:26.20vh;max-height:175px;content:"";} #section5 .element .introduce {text-align:center;} #section5 .element .introduce dl {} #section5 .element .introduce dl > dt {} #section5 .element .introduce dl > dt .line1 {color:#333333;font-size:36px;} #section5 .element .introduce dl > dt .line1 b {color:#3d6aa9;font-size:39px;font-family:"NEXON Lv2 Gothic Bold";} #section5 .element .introduce dl > dt .line2 {margin:25px 0 0 0;color:#333333;font-size:48px;} #section5 .element .introduce dl > dt .line2 b {opacity:0;color:#3d6aa9;font-size:48px;letter-spacing:-48px;font-family:"NEXON Lv2 Gothic Bold";} #section5 .element .introduce dl > dt .line2 b.on {opacity:1;color:#3d6aa9;letter-spacing:0;transition:all 1s;} #section5 .element .introduce dl > dd {} #section5 .element .introduce dl > dd:before {display:block;content:"";height:50px;} #section5 .element .introduce dl > dd .box {display:block;padding:20px 0 20px 0;background:rgba(256,256,256,0);} #section5 .element .introduce dl > dd .box .description1 {} #section5 .element .introduce dl > dd .box .description1 ul {font-size:0;} #section5 .element .introduce dl > dd .box .description1 ul > li {display:inline-block;width:420px;height:236px;margin-right:26px;margin-bottom:26px;overflow:hidden;} #section5 .element .introduce dl > dd .box .description1 ul > li:nth-child(2n) {margin-right:0;} #section5 .element .introduce dl > dd .box .description1 ul > li:nth-child(3) {margin-bottom:0 !important;} #section5 .element .introduce dl > dd .box .description1 ul > li:nth-child(4) {margin-bottom:0 !important;;} #section5 .element .introduce dl > dd .box .description1 ul > li img {opacity:0;width:414px;height:auto;border:3px solid white;} #section5 .element .introduce dl > dd .box .description1 ul li:nth-child(1) img {opacity:0;margin:0 0 0 -414px;} #section5 .element .introduce dl > dd .box .description1 ul li:nth-child(2) img {opacity:0;margin:0 0 0 414px;} #section5 .element .introduce dl > dd .box .description1 ul li:nth-child(3) img {opacity:0;margin:0 0 0 -414px;} #section5 .element .introduce dl > dd .box .description1 ul li:nth-child(4) img {opacity:0;margin:0 0 0 414px;} #section5 .element .introduce dl > dd .box .description1 ul.on li:nth-child(1) img {opacity:1;margin:0 0 0 0;transition:all 0.3s 0;} #section5 .element .introduce dl > dd .box .description1 ul.on li:nth-child(2) img {opacity:1;margin:0 0 0 0;transition:all 0.3s 0.2s;} #section5 .element .introduce dl > dd .box .description1 ul.on li:nth-child(3) img {opacity:1;margin:0 0 0 0;transition:all 0.3s 0.2s;} #section5 .element .introduce dl > dd .box .description1 ul.on li:nth-child(4) img {opacity:1;margin:0 0 0 0;transition:all 0.3s 0;} #section6 {display:;} #section6 .section_group {} #section6 .element {position:relative;z-index:30;} #section6 .element .introduce:before {display:block;height:19.25vh;max-height:208px;content:"";} #section6 .element .introduce {font-size:0;text-align:center;background:transparent;} #section6 .element .introduce .detail {display:inline-block;vertical-align:top;width:640px;padding:0 0 0 0;text-align:left;background:transparent;} #section6 .element .introduce .detail .title {opacity:0;display:block;padding:0 0 0 0;color:#3b6aab;font-size:34px;letter-spacing:-34px;font-family:"NEXON Lv2 Gothic Bold";} #section6 .element .introduce .detail .title.on {opacity:1;color:#3b6aab;letter-spacing:0;transition:all 0.6s;} #section6 .element .introduce .detail .description1 {display:inline-block;padding:24px 0 0 0;color:#323232;font-size:27px;line-height:36px;} #section6 .element .introduce .detail .description1 b {padding:24px 0 0 0;color:#323232;font-size:27px;font-family:"NEXON Lv2 Gothic Bold";} #section6 .element .introduce .detail .description2 {display:inline-block;padding:24px 0 0 0;color:#323232;font-size:27px;line-height:36px;} #section6 .element .introduce .detail .description2 b {padding:24px 0 0 0;color:#323232;font-size:27px;font-family:"NEXON Lv2 Gothic Bold";} #section6 .element .introduce .detail .box1 {margin:45px 0 0 0;} #section6 .element .introduce .detail .box1 ul {} #section6 .element .introduce .detail .box1 ul > li {padding:0 0 10px 0;} #section6 .element .introduce .detail .box1 ul > li .icon {display:inline-block;vertical-align:middle;} #section6 .element .introduce .detail .box1 ul > li .icon img {width:27px;} #section6 .element .introduce .detail .box1 ul > li .txt {display:inline-block;vertical-align:middle;color:#323232;font-size:24px;padding:0 0 0 10px;;} #section6 .element .introduce .detail .box2 {margin:40px 0 0 0;width:525px;height:180px;background:#ffffff;} #section6 .element .introduce .detail .box2 .subTitle {display:inline-block;background:#3b6aab;margin:-20px 0 0 0;padding:7px 10px 3px 10px;color:white;font-size:21px;} #section6 .element .introduce .detail .box2 .subTitle b {display:inline-block;color:#fff06e;font-size:21px;font-family:"NEXON Lv2 Gothic Bold";} #section6 .element .introduce .detail .box2 ul {margin:20px 0 0 20px;} #section6 .element .introduce .detail .box2 ul > li {padding:0 0 10px 0;} #section6 .element .introduce .detail .box2 ul > li .icon {display:inline-block;vertical-align:middle;} #section6 .element .introduce .detail .box2 ul > li .icon img {width:22px;} #section6 .element .introduce .detail .box2 ul > li .txt {display:inline-block;vertical-align:middle;padding:0 0 0 10px;color:#323232;font-size:21px;} #section6 .element .introduce .summary {display:inline-block;vertical-align:top;width:550px;padding:0 0 0 0;text-align:right;background:transparent;} #section6 .element .introduce .summary .title {display:inline-block;} #section6 .element .introduce .summary .title1 {color:#ffffff;margin-top:0;font-size:30px;} #section6 .element .introduce .summary .title1 b {color:#ffffff;margin-top:0;font-size:30px;font-family:"NEXON Lv2 Gothic Bold";} #section6 .element .introduce .summary .title2 {color:#acd4f9;margin-top:20px;font-size:46px;font-family:"NEXON Lv2 Gothic Bold";} #section6 .element .introduce .summary .title3 {color:#fff06e;margin-top:50px;font-size:24px;padding:5px 0 3px 0;width:185px;border:1px solid #fff06e;text-align:center;line-height:24px;} #section6 .element .introduce .summary .visual {} #section6 .element .introduce .summary .visual .item1 {} #section6 .element .introduce .summary .visual .item2 {} #section6 .element .introduce .summary .visual .item3 {} #section6 .element .introduce .summary .visual .item img {position:absolute;} #section6 .element .introduce .summary .visual .item1 img {z-index:60;margin:0 0 0 -450px;} #section6 .element .introduce .summary .visual .item2 img {z-index:70;margin:80px 0 0 -160px;} #section7 {display:;overflow:hidden;} #section7 .section_group {width:1920px;} #section7 .element {position:relative;z-index:30;} #section7 .element .introduce:before {display:block;height:13.88vh;max-height:150px;content:"";} #section7 .element .introduce {text-align:center;} #section7 .element .introduce dl {} #section7 .element .introduce dl > dt {} #section7 .element .introduce dl > dt .line1 {margin:0 0 0 0;color:#333333;font-size:32px;} #section7 .element .introduce dl > dt .line2 {opacity:0;margin:25px 0 0 0;color:#3b6aab;font-size:55px;letter-spacing:-55px;font-family:"NEXON Lv2 Gothic Bold";} #section7 .element .introduce dl > dt .line2.on {opacity:1;letter-spacing:0;transition:all 0.6s;} #section7 .element .introduce dl > dt .line3 {margin:34px 0 0 0;color:#333333;font-size:24px;line-height:32px;} #section7 .element .introduce dl > dt .line3 b{font-size:24px;font-family:"NEXON Lv2 Gothic Bold";} #section7 .element .introduce dl > dd {} #section7 .element .introduce dl > dd:before {display:block;content:"";height:50px;} #section7 .element .introduce dl > dd .director {display:inline-block;vertical-align:top;width:640px;height:480px;padding:30px 0 0 30px;text-align:left;} #section7 .element .introduce dl > dd .director .simbol {position:absolute;z-index:90;width:640px;text-align:right;} #section7 .element .introduce dl > dd .director .simbol img {background:transparent;margin:-30px -100px 0 0;} #section7 .element .introduce dl > dd .director .card {} #section7 .element .introduce dl > dd .director .card .position {display:inline-block;color:#ffffff;font-size:34px;} #section7 .element .introduce dl > dd .director .card .name {display:inline-block;color:#ffffff;font-size:34px;font-family:"NEXON Lv2 Gothic Bold";padding:0 0 0 10px;} #section7 .element .introduce dl > dd .history {margin:25px 0 0 0;} #section7 .element .introduce dl > dd .history ul {} #section7 .element .introduce dl > dd .history ul > li {color:#ffffff;font-size:17px;line-height:26px;} #section7 .element .introduce dl > dd .director1 {background:#3b6aab;margin:0 80px 0 0;} #section7 .element .introduce dl > dd .director1 .visual {opacity:0.5;position:absolute;z-index:100;height:540px;margin:0 0 0 0;background:transparent;} #section7 .element .introduce dl > dd .director1 .visual.on {opacity:1;margin:-63px 0 0 0;transition:all 0.6s;} #section7 .element .introduce dl > dd .director1 .visual img {height:543px;margin:0 0 0 375px;} #section7 .element .introduce dl > dd .director2 {background:#222a35;} #section7 .element .introduce dl > dd .director2 .visual {opacity:0.5;position:absolute;z-index:100;height:540px;margin:0 0 0 0;background:transparent;} #section7 .element .introduce dl > dd .director2 .visual.on {opacity:1;margin:-60px 0 0 0;transition:all 0.6s 0.1s} #section7 .element .introduce dl > dd .director2 .visual img {height:540px;margin:0 0 0 320px;} #section8 {display:;} #section8 .section_group {} #section8 .element {position:relative;z-index:30;} #section8 .element .introduce:before {display:block;height:15vh;max-height:150px;content:"";} #section8 .element .introduce {text-align:center;} #section8 .element .introduce dl {} #section8 .element .introduce dl > dt {} #section8 .element .introduce dl > dt .line1 {margin:0 0 0 0;color:#ffffff;font-size:36px;} #section8 .element .introduce dl > dt .line2 {margin:32px 0 0 0;color:#ffffff;font-size:36px;font-family:"NEXON Lv2 Gothic Bold";} #section8 .element .introduce dl > dt .line3 {opacity:0;margin:45px 0 0 0;color:#acd4f9;font-size:36px;letter-spacing:-36px;font-family:"High Summit";} #section8 .element .introduce dl > dt .line3.on {opacity:1;letter-spacing:0;transition:all 0.6s;} #section8 .element .introduce dl > dt .line4 {margin:50px 0 0 0;color:#ffffff;font-size:24px;line-height:34px;} #section8 .element .introduce dl > dt .line4 b {color:#ffffff;font-size:24px;line-height:34px;font-family:"NEXON Lv2 Gothic Bold";} #section8 .element .introduce dl > dd {text-align:center;} #section8 .element .introduce dl > dd:before {display:block;content:"";height:50px;} #section8 .element .introduce dl > dd .box {display:inline-block;width:910px;} #section8 .element .introduce dl > dd .box {} #section8 .element .introduce dl > dd .box ul {font-size:0;} #section8 .element .introduce dl > dd .box ul > li {opacity:0;transform:translatey(0);display:inline-block;width:195px;height:195px;vertical-align:top;margin:0 25px 25px 0;background:white;border-radius:30px 0 30px 0;text-align:center;} #section8 .element .introduce dl > dd .box ul > li:nth-child(4n) {margin-right:0;} #section8 .element .introduce dl > dd .box ul > li:nth-child(1) {background:white;} #section8 .element .introduce dl > dd .box ul > li:nth-child(2) {background:#7db1df;} #section8 .element .introduce dl > dd .box ul > li:nth-child(3) {background:white;} #section8 .element .introduce dl > dd .box ul > li:nth-child(4) {background:#7db1df;} #section8 .element .introduce dl > dd .box ul > li:nth-child(5) {background:#7db1df;} #section8 .element .introduce dl > dd .box ul > li:nth-child(6) {background:white;} #section8 .element .introduce dl > dd .box ul > li:nth-child(7) {background:#7db1df;} #section8 .element .introduce dl > dd .box ul > li:nth-child(8) {background:white;} #section8 .element .introduce dl > dd .box ul > li:nth-child(1) span {color:#3b6aab;} #section8 .element .introduce dl > dd .box ul > li:nth-child(2) span {color:white;} #section8 .element .introduce dl > dd .box ul > li:nth-child(3) span {color:#3b6aab;} #section8 .element .introduce dl > dd .box ul > li:nth-child(4) span {color:white;} #section8 .element .introduce dl > dd .box ul > li:nth-child(5) span {color:white;} #section8 .element .introduce dl > dd .box ul > li:nth-child(6) span {color:#3b6aab;} #section8 .element .introduce dl > dd .box ul > li:nth-child(7) span {color:white;} #section8 .element .introduce dl > dd .box ul > li:nth-child(8) span {color:#3b6aab;} #section8 .element .introduce dl > dd .box ul > li .icon {display:inline-block;padding-top:10px;} #section8 .element .introduce dl > dd .box ul > li .summary {display:inline-block;padding-top:10px;width:100%;font-size:18px;line-height:23px;} #section8 .element .introduce dl > dd .box ul > li .title{display:inline-block;padding-top:10px;width:100%;font-size:26px;font-family:"NEXON Lv2 Gothic Bold";} #section8 .element .introduce dl > dd .box ul.on li:nth-child(1) {opacity:1;transform:translatey(0);transition:all 0.3s 0s;} #section8 .element .introduce dl > dd .box ul.on li:nth-child(2) {opacity:1;transform:translatey(0);transition:all 0.3s 0.1s;} #section8 .element .introduce dl > dd .box ul.on li:nth-child(3) {opacity:1;transform:translatey(0);transition:all 0.3s 0.2s;} #section8 .element .introduce dl > dd .box ul.on li:nth-child(4) {opacity:1;transform:translatey(0);transition:all 0.3s 0.3s;} #section8 .element .introduce dl > dd .box ul.on li:nth-child(5) {opacity:1;transform:translatey(0);transition:all 0.3s 0.4s;} #section8 .element .introduce dl > dd .box ul.on li:nth-child(6) {opacity:1;transform:translatey(0);transition:all 0.3s 0.5s;} #section8 .element .introduce dl > dd .box ul.on li:nth-child(7) {opacity:1;transform:translatey(0);transition:all 0.3s 0.6s;} #section8 .element .introduce dl > dd .box ul.on li:nth-child(8) {opacity:1;transform:translatey(0);transition:all 0.3s 0.7s;} #section9 {display:;} #section9 .section_group {} #section9 .element {position:relative;z-index:30;} #section9 .element .introduce:before {display:block;height:19.07vh;max-height:206px;content:"";} #section9 .element .introduce {text-align:center;} #section9 .element .introduce dl {} #section9 .element .introduce dl > dt {} #section9 .element .introduce dl > dt .line1 {margin:0 0 0 0;color:#26262;font-size:42px;line-height:54px;font-family:"NEXON Lv2 Gothic Bold";} #section9 .element .introduce dl > dt .line1 span {font-size:42px;font-family:"NEXON Lv2 Gothic Bold";} #section9 .element .introduce dl > dt .line1 em {opacity:0;color:#3b6aab;font-size:42px;letter-spacing:-42px;font-family:"NEXON Lv2 Gothic Bold";} #section9 .element .introduce dl > dt .line1 em.on {opacity:1;letter-spacing:0;transition:all 0.6s;} #section9 .element .introduce dl > dt .line2 {margin:52px 0 0 0;color:#26262;font-size:25px;line-height:34px;font-family:"NEXON Lv2 Gothic";} #section9 .element .introduce dl > dt .line2 b {font-size:25px;font-family:"NEXON Lv2 Gothic Bold";} #section9 .element .introduce dl > dt .line3 {margin:45px 0 0 0;color:#26262;font-size:25px;line-height:34px;} #section9 .element .introduce dl > dt .line3 b {font-size:25px;font-family:"NEXON Lv2 Gothic Bold";} #section9 .element .introduce dl > dd {margin:70px 0 0 0;text-align:center;} #section9 .element .introduce dl > dd .box {position:relative;z-index:100;display:inline-block;width:950px;height:254px;background:white;border:1px solid #c0c0c0;} #section9 .element .introduce dl > dd .box .decoration {display:block;position:absolute;z-index:10;width:110px;;height:110px;background:transparent;font-size:0;} #section9 .element .introduce dl > dd .box .decoration1 {margin:-10px 0 0 840px;border-top:10px solid transparent;border-right:10px solid transparent;} #section9 .element .introduce dl > dd .box .decoration2 {margin:-75px 0 0 -10px;border-bottom:10px solid transparent;border-left:10px solid transparent;} #section9 .element .introduce dl > dd .box.on .decoration1 {border-top:10px solid #b2b2b2;border-right:10px solid #b2b2b2;transition:all 01s;} #section9 .element .introduce dl > dd .box.on .decoration2 {border-bottom:10px solid #b2b2b2;border-left:10px solid #b2b2b2;transition:all 1s;} #section9 .element .introduce dl > dd .box ul {font-size:0;margin:35px 0 0 0;} #section9 .element .introduce dl > dd .box ul > li {display:inline-block;vertical-align:top;margin-right:15px;} #section9 .element .introduce dl > dd .box ul > li:last-child {margin-right:0;} #section9 .element .introduce dl > dd .box ul > li .license {} #section9 .element .introduce dl > dd .box ul > li .license img {width:125px;border:1px solid #f0f0f0;} #section10 {display:;} #section10 .section_group {} #section10 .element {position:relative;z-index:30;} #section10 .element .introduce:before {display:block;height:20.83vh;max-height:225px;content:"";} #section10 .element .introduce {text-align:center;} #section10 .element .introduce dl {} #section10 .element .introduce dl > dt {} #section10 .element .introduce dl > dt .line1 {margin:0 0 0 0;color:#ffffff;font-size:32px;line-height:54px;font-family:"NEXON Lv2 Gothic Bold";} #section10 .element .introduce dl > dt .line2 {margin:25px 0 0 0;color:#ffffff;font-size:55px;font-family:"NEXON Lv2 Gothic Bold";} #section10 .element .introduce dl > dt .line2 b {opacity:0;color:#9bcfff;font-size:55px;letter-spacing:-55px;font-family:"NEXON Lv2 Gothic Bold";} #section10 .element .introduce dl > dt .line2 b.on {opacity:1;letter-spacing:0;transition:all 0.6s;} #section10 .element .introduce dl > dt .line3 {margin:45px 0 0 0;color:#ffffff;font-size:25px;line-height:34px;} #section10 .element .introduce dl > dt .line3 b {color:#ffffff;font-size:25px;font-family:"NEXON Lv2 Gothic Bold";} #section10 .element .introduce dl > dd {margin:55px 0 0 0;text-align:center;} #section10 .element .introduce dl > dd .box {display:inline-block;width:710px;height:385px;background:white;} #section10 .element .introduce dl > dd .box .title {display:inline-block;margin:12px 0 30px 0;padding:7px 0 5px 0;width:684px;background:#222a35;color:white;font-size:25px;font-family:"NEXON Lv2 Gothic Bold";} #section10 .element .introduce dl > dd .box .slider {} #section10 .element .introduce dl > dd .box .slider .item {font-size:0;background:transparent;padding:5px 0 5px 0;} #section10 .element .introduce dl > dd .box .slider .item .summary {display:inline-block;vertical-align:top;width:380px;padding:0 0 0 20px;text-align:left;background:transparent;} #section10 .element .introduce dl > dd .box .slider .item .summary .name {color:#3b6aab;font-size:39px;font-family:"NEXON Lv2 Gothic Bold";} #section10 .element .introduce dl > dd .box .slider .item .summary .contents {height:180px;margin:20px 0 0 0;color:#343434;font-size:18px;line-height:27px;background:transparent;letter-spacing:-0.1px;} #section10 .element .introduce dl > dd .box .slider .item .summary .step {color:#cccccc;font-size:30px;font-family:"NEXON Lv2 Gothic Bold";transform:translate;} #section10 .element .introduce dl > dd .box .slider .item .visual {display:inline-block;vertical-align:top;width:300px;background:transparent;} #section10 .element .introduce dl > dd .box .slider .item .visual .line {position:absolute;z-index:20;display:block;margin:10px 0 0 30px;width:240px;height:240px;border:1px solid #cccccc;} #section10 .element .introduce dl > dd .box .slider .item .visual img {position:relative;z-index:30;width:240px;height:240px;box-shadow:0 0 10px gray;margin:0 0 0 20px;} #section10 .element .introduce dl > dd .box .slider .item3 .summary .contents {letter-spacing:-0.1px;} #section10 .slick-prev.slick-arrow:before {display:inline-block;content:"";color:white;font-size:5vw;} #section10 .slick-prev.slick-arrow {z-index:100;margin:-40px 0 0 5px;background:rgba(256,256,256,1);width:40px;height:40px;border-radius:50%;transform:translate(-0.6px,0);padding:0 0 0 0;background-image:url('/resource/image/icon/icon_left_green.png'); background-repeat:no-repeat;background-size:22px;background-position:center center;border:2px solid #cccccc;} #section10 .slick-next.slick-arrow:before {display:inline-block;content:"";color:white;font-size:5vw;} #section10 .slick-next.slick-arrow {z-index:100;margin:-40px 5px 0 0;background:rgba(256,256,256,1);width:40px;height:40px;border-radius:50%;transform:translate(-0.6px,0);padding:0 0 0 0;background-image:url('/resource/image/icon/icon_right_green.png'); background-repeat:no-repeat;background-size:22px;background-position:center center;border:2px solid #cccccc;} #section10 .slick-dots {background:transparent;text-align:center;} #section10 .slick-dots button:before {color:#4171ba;font-size:12px;} #section11 {display:;} #section11 .section_group {} #section11 .element {position:relative;z-index:30;} #section11 .element .introduce:before {display:block;height:21.85vh;max-height:236px;content:"";} #section11 .element .introduce {text-align:center;} #section11 .element .introduce dl {} #section11 .element .introduce dl > dt {} #section11 .element .introduce dl > dt .line1 {margin:0 0 0 0;color:#333333;font-size:32px;line-height:54px;font-family:"NEXON Lv2 Gothic Bold";} #section11 .element .introduce dl > dt .line2 {margin:40px 0 0 0;color:#333333;font-size:55px;line-height:66px;font-family:"NEXON Lv2 Gothic Bold";} #section11 .element .introduce dl > dt .line2 b {color:#3d6aa9;font-size:55px;font-family:"NEXON Lv2 Gothic Bold";} #section11 .element .introduce dl > dt .line2 b.point {opacity:0;letter-spacing:-55px;} #section11 .element .introduce dl > dt .line2 b.point.on {opacity:1;color:#3d6aa9;letter-spacing:0;transition:all 0.6s;} #section11 .element .introduce dl > dd {margin:80px 0 0 0;text-align:center;} #section11 .element .introduce dl > dd .box {} #section11 .element .introduce dl > dd .box ul {font-size:0;} #section11 .element .introduce dl > dd .box ul > li {display:inline-block;margin-right:70px;} #section11 .element .introduce dl > dd .box ul > li:last-child {margin-right:0;} #section11 .element .introduce dl > dd .box ul > li .step {opacity:0;position:relative;z-index:30;display:inline-block;width:40px;height:40px;background:#3d6aa9;color:white;font-size:21px;line-height:42px;border:2px solid white;border-radius:50%;font-family:"NEXON Lv2 Gothic Bold";} #section11 .element .introduce dl > dd .box ul > li:nth-child(1) .step.on {opacity:1;transform:translatey(25px);transition:all 1s 0s;} #section11 .element .introduce dl > dd .box ul > li:nth-child(2) .step.on {opacity:1;transform:translatey(25px);transition:all 1s 0.2s;} #section11 .element .introduce dl > dd .box ul > li:nth-child(3) .step.on {opacity:1;transform:translatey(25px);transition:all 1s 0.3s;} #section11 .element .introduce dl > dd .box ul > li:nth-child(4) .step.on {opacity:1;transform:translatey(25px);transition:all 1s 0.4s;} #section11 .element .introduce dl > dd .box ul > li img {position:relative;z-index:20;margin:0 0 0 0;width:257px;height:auto;display:block;border:2px solid #ffffff;} #section11 .element .introduce dl > dd .box ul > li .summary {padding:30px 0 0 0;font-size:21px;line-height:30px;color:white;;} #section11 .element .introduce dl > dd .box ul > li .summary b {color:#ffffff;font-size:21px;font-family:"NEXON Lv2 Gothic Bold";} #section12 {display:;} #section12 .section_group {} #section12 .element {position:relative;z-index:30;} #section12 .element .introduce:before {display:block;height:15.18vh;max-height:164px;content:"";} #section12 .element .introduce {text-align:center;} #section12 .element .introduce dl {} #section12 .element .introduce dl > dt {} #section12 .element .introduce dl > dt .line1 {margin:0 0 0 0;color:#333333;font-size:32px;line-height:54px;font-family:"NEXON Lv2 Gothic Bold";} #section12 .element .introduce dl > dt .line2 {opacity:0;margin:27px 0 0 0;color:#3b6aab;font-size:55px;letter-spacing:-55px;line-height:66px;font-family:"NEXON Lv2 Gothic Bold";} #section12 .element .introduce dl > dt .line2.on {opacity:1;color:#3b6aab;letter-spacing:0;transition:all 0.6s;} #section12 .element .introduce dl > dd {margin:50px 0 0 0;text-align:center;} #section12 .element .introduce dl > dd .box {} #section12 .element .introduce dl > dd .box .gallery .detail {display:inline-block;vertical-align:top;width:640px;margin-right:40px;background:transparent;} #section12 .element .introduce dl > dd .box .gallery .detail img {width:640px;height:auto;border:3px solid white;} #section12 .element .introduce dl > dd .box .gallery .list {display:inline-block;vertical-align:top;width:440px;text-align:left;background:transparent;} #section12 .element .introduce dl > dd .box .gallery .list ul {font-size:0;} #section12 .element .introduce dl > dd .box .gallery .list ul > li {display:inline-block;margin:0 8px 8px 0;background:transparent;cursor:pointer;} #section12 .element .introduce dl > dd .box .gallery .list ul > li:nth-child(2n) {margin-right:0;} #section12 .element .introduce dl > dd .box .gallery .list ul > li img {width:200px;border:2px solid white;} #section12 .element .introduce dl > dd .box .gallery .list ul > li img.on {border:2px solid #4171ba;transition:all 1s;} #section13 {display:;} #section13 .section_group {} #section13 .element {position:relative;z-index:30;} #section13 .element .introduce:before {display:block;height:15.18vh;max-height:164px;content:"";} #section13 .element .introduce {text-align:center;} #section13 .element .introduce dl {} #section13 .element .introduce dl > dt {} #section13 .element .introduce dl > dt .line1 {margin:0 0 0 0;color:white;font-size:32px;line-height:54px;font-family:"NEXON Lv2 Gothic Bold";} #section13 .element .introduce dl > dt .line2 {margin:27px 0 0 0;color:white;font-size:55px;line-height:66px;font-family:"NEXON Lv2 Gothic Bold";} #section13 .element .introduce dl > dt .line2 b {opacity:0;color:#9bcfff;font-size:55px;letter-spacing:-55px;line-height:66px;font-family:"NEXON Lv2 Gothic Bold";} #section13 .element .introduce dl > dt .line2 b.on {opacity:1;letter-spacing:0;transition:all 0.6s;} #section13 .element .introduce dl > dd {margin:50px 0 0 0;text-align:center;} #section13 .element .introduce dl > dd .box1 {display:block;position:relative;left:0;margin:0;padding:0;width:100%;height:20vw;z-index:1000;background:rgba(28,55,93,1);} #section13 .element .introduce dl > dd .inner_gorup1 {width:890px;margin:0 auto 0 auto;padding:32px 0 0 0;background:transparent;} #section13 .element .introduce dl > dd .inner_gorup1:after {clear:both;display:block;content:"";} #section13 .element .introduce dl > dd .inner_gorup1 .map {display:box;float:left;width:545px;height:322px;background:#ffffff;} #section13 .element .introduce dl > dd .inner_gorup1 .schedule {display:box;float:right;width:310px;text-align:left;background:transparent;} #section13 .element .introduce dl > dd .inner_gorup1 .schedule .title {} #section13 .element .introduce dl > dd .inner_gorup1 .schedule .title .icon {display:inline-block;vertical-align:middle;} #section13 .element .introduce dl > dd .inner_gorup1 .schedule .title .icon img {width:25px;} #section13 .element .introduce dl > dd .inner_gorup1 .schedule .title .txt {display:inline-block;vertical-align:middle;padding:0 0 0 10px;font-size:19px;color:#9bcfff;font-family:"NEXON Lv2 Gothic Bold";} #section13 .element .introduce dl > dd .inner_gorup1 .schedule ul {margin:10px 0 10px 0;border-top:1px solid #61738e;border-bottom:1px solid #61738e;} #section13 .element .introduce dl > dd .inner_gorup1 .schedule ul > li {line-height:24px;} #section13 .element .introduce dl > dd .inner_gorup1 .schedule ul > li:first-child {padding-top:15px;} #section13 .element .introduce dl > dd .inner_gorup1 .schedule ul > li:last-child {padding-bottom:10px;} #section13 .element .introduce dl > dd .inner_gorup1 .schedule ul > li .week {display:inline-block;width:100px;color:white;font-size:19px;font-family:"NEXON Lv2 Gothic Bold";letter-spacing:5px;} #section13 .element .introduce dl > dd .inner_gorup1 .schedule ul > li .time {color:#ffffff;font-size:19px;} #section13 .element .introduce dl > dd .inner_gorup1 .schedule .addtional {margin:5px 0 0 0;color:white;font-size:15px;line-height:22px;} #section13 .element .introduce dl > dd .box2 {display:block;margin:0 0 0 0;} #section13 .element .introduce dl > dd .box2 .icon img {width:35px;} #section13 .element .introduce dl > dd .inner_gorup2 {width:890px;margin:32px auto 0 auto;background:transparent;} #section13 .element .introduce dl > dd .inner_gorup2:after {clear:both;display:block;content:"";} #section13 .element .introduce dl > dd .inner_gorup2 .location {display:box;float:left;width:545px;background:transparent;text-align:left;} #section13 .element .introduce dl > dd .inner_gorup2 .location ul {} #section13 .element .introduce dl > dd .inner_gorup2 .location ul > li {display:block;padding-bottom:15px;} #section13 .element .introduce dl > dd .inner_gorup2 .location .icon {display:inline-block;vertical-align:middle;} #section13 .element .introduce dl > dd .inner_gorup2 .location .item_name {display:inline-block;vertical-align:middle;color:#9bcfff;font-size:22px;width:100px;padding:0 0 0 10px;} #section13 .element .introduce dl > dd .inner_gorup2 .location .item_contents {display:inline-block;vertical-align:middle;color:white;font-size:22px;line-height:32px;} #section13 .element .introduce dl > dd .inner_gorup2 .contract {display:box;float:right;width:310px;text-align:left;background:transparent;} #section13 .element .introduce dl > dd .inner_gorup2 .contract .icon {display:inline-block;vertical-align:middle;} #section13 .element .introduce dl > dd .inner_gorup2 .contract .item_name {display:inline-block;vertical-align:middle;color:#9bcfff;font-size:22px;width:100px;padding:0 0 0 10px;} #section13 .element .introduce dl > dd .inner_gorup2 .contract .item_contents {display:block;padding:10px 0 0 0;} #section13 .element .introduce dl > dd .inner_gorup2 .contract .item_contents a {color:white;font-size:36px;font-family:"NEXON Lv2 Gothic Bold";padding:0 0 0 0;} #section14 {display:;background:#eeeeee;} #section14 .section_group {} #section14 .section_group:before {clear:both;display:block;content:"";padding-top:20px;} #section14 .section_group:after {clear:both;display:block;content:"";padding-bottom:20px;} #section14 .logo {float:left;width:25%;text-align:center;vertical-align:middle;} #section14 .logo img {width:138px;margin:20px 0 0 0;display:inline-block;} #section14 .information {float:left;width:75%;text-align:left;} #section14 .information span {display:block;font-size:16px;line-height:24px;transform: skew(-0.001deg);} #gnb {display:;} #section1 {display:;} #section2 {display:;} #section3 {display:;} #section4 {display:;} #section5 {display:;} #section6 {display:;} #section7 {display:;} #section8 {display:;} #section9 {display:;} #section10 {display:;} #section11 {display:;} #section12 {display:;} #section13 {display:;} /* 비급여 진료 수가표 */ #section14 .information span.price_table { display: inline-block; border: 1px solid black; padding: 2px 4px; margin-left: 10px; cursor: pointer; } #section14 .price_tableWrap { position: fixed; left: 0; bottom: 0; width: 100vw; height: 100vh; background-color: rgba(0, 0, 0, 0.7); z-index: 999; display: none; } #section14 .price_tableWrap .content_wrap { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; gap: 30px; justify-content: center; width: 50%; } #section14 .price_tableWrap .content_wrap .btn-close { position: absolute; right: -80px; top: -50px; display: block; width: 40px; height: 40px; font-size: 30px; font-weight: bold; color: white; cursor: pointer; } #section14 .price_tableWrap .content_wrap img { width: 50%; } }