@charset "UTF-8"; #contact { width: 100%; height: 750px; background-color: #263d78; } #contact > h3 { position: relative; padding: 50px 0 0; font-weight: 600; text-align: center; color: #fff; text-transform: uppercase; } #contact > h3:after { position: absolute; bottom: -20px; left: 50.2%; transform: translateX(-50%); font-size: 15px; font-weight: 800; color: #111; letter-spacing: 4px; content: "How to come"; } #contact > .mapContainer { width: 600px; height: 300px; margin: 60px auto 200px; } #contact > .mapContainer > .map { width: 600px; height: 450px; background-image: url(../images/map_eng_18.08.06.jpg); background-position: 50% 50%; background-size: cover; border: 0; } #contact > .mapContainer > .map > a { display: block; width: 100%; height: 100%; text-indent: -99999px; } #contact > .mapInfo { position: relative; width: 100%; text-align: center; } #contact > .mapInfo:after { position: absolute; top: 0; left: 20%; width: 35px; height: 30px; background-image: url(../images/bg_quote.png); background-position: 0 50%; content: ''; } #contact > .mapInfo:before { position: absolute; bottom: 0; right: 20%; width: 35px; height: 30px; background-image: url(../images/bg_quote.png); background-position: -35px 50%; content: ''; } #contact > .mapInfo > .inner > ul > li { font-size: 18px; font-weight: 600; color: #fff; line-height: 1.8em; } #contact > .mapInfo > .inner > ul > li > span { color: #111; font-weight: 900; } @media screen and (max-width: 768px) { /*contact 768px 반응형*/ #contact { width: 100%; height: auto; background-color: #263d78; } #contact > h3 { position: relative; padding: 50px 0 0; font-weight: 600; text-align: center; color: #fff; text-transform: uppercase; } #contact > h3:after { position: absolute; bottom: -20px; left: 50.2%; transform: translateX(-50%); font-size: 15px; font-weight: 800; color: #111; letter-spacing: 4px; content: "How to come"; } #contact > .mapContainer { width: 90%; height: 450px; margin: 60px auto 40px; } #contact > .mapContainer > .map { width: 100%; height: 450px; background-image: url(../images/map_eng_18.08.06.jpg); background-position: 10% 50%; background-size: cover; border: 0; } #contact > .mapContainer > .map > a { display: block; width: 100%; height: 100%; text-indent: -99999px; } #contact > .mapInfo { position: relative; width: 100%; text-align: center; padding-bottom: 50px; } #contact > .mapInfo:after { display: none; position: absolute; top: 0; left: 20%; width: 35px; height: 30px; background-image: url(../images/bg_quote.png); background-position: 0 50%; content: ''; } #contact > .mapInfo:before { display: none; position: absolute; bottom: 0; right: 20%; width: 35px; height: 30px; background-image: url(../images/bg_quote.png); background-position: -35px 50%; content: ''; } #contact > .mapInfo > .inner > ul > li { font-size: 18px; font-weight: 600; color: #fff; line-height: 1.8em; } #contact > .mapInfo > .inner > ul > li > span { display: block; color: #111; font-weight: 900; } } @media screen and (max-width: 768px) { #status > .status > ul > li.status_info_main:after { display: none; } } #since_eng { width: 100%; margin-bottom: 60px; height: 850px; background-color: #fff; } #since_eng > .since { position: relative; width: 1000px; margin: 0 auto; } #since_eng > .since > ul { margin-top: 80px; width: 100%; } #since_eng > .since > ul > li { margin-top: 20px; font-size: 15px; font-weight: 600; color: #333; line-height: 2em; } #since_eng > .since > ul > li.status_info_main { position: relative; font-size: 30px; font-weight: 700; color: #263d78; margin-bottom: 55px; line-height: 1.3em; /* &:before { position: absolute; top: 0px; right: 30px; width: 50px; height: 50px; background-image: url(../images/house.png); background-repeat: no-repeat; background-size: contain; background-position: 50% 50%; content: ''; }//house */ } #since_eng > .since > ul > li.status_info_main:after { position: absolute; top: 65px; left: 0; width: 100%; height: 1px; background-color: #ddd; content: ''; } #since_eng > .since > ul > li > em { color: #ffc700; } #since_eng > .since > ul > li > span { font-size: 20px; } #since_eng > .since > .since_info { width: 100%; } #since_eng > .since > .since_info > h2 { font-size: 50px; font-weight: 500; font-style: italic; letter-spacing: -4px; color: #eee; } #since_eng > .since > .since_info > div { width: 100%; margin: 10px auto 0; border-bottom: 1px dotted #ddd; } #since_eng > .since > .since_info > div > ul { width: 100%; } #since_eng > .since > .since_info > div > ul > li { float: left; margin-left: 230px; line-height: 2.2em; } #since_eng > .since > .since_info > div > ul > li:first-child { font-size: 40px; font-weight: 900; color: #ddd; } #since_eng > .since > .since_info > div > ul > li > dl { padding: 5px 10px; width: 100%; } #since_eng > .since > .since_info > div > ul > li > dl > dd { position: relative; font-size: 15px; font-weight: 600; } #since_eng > .since > .since_info > div > ul > li > dl > dd:after { position: absolute; top: 50%; transform: translateY(-50%); left: -20px; width: 10px; height: 10px; border-radius: 15px; background-color: #ffc700; content: ''; } @media screen and (max-width: 768px) { #since_eng { width: 100%; margin-bottom: 0px; padding-bottom: 80px; height: auto; background-color: #fff; } #since_eng > .since { position: relative; width: 90%; margin: 0 auto; } #since_eng > .since > ul { margin-top: 80px; width: 100%; } #since_eng > .since > ul > li { margin-top: 20px; font-size: 15px; font-weight: 600; color: #333; line-height: 2em; } #since_eng > .since > ul > li.status_info_main { position: relative; font-size: 22px; font-weight: 600; color: #263d78; margin-bottom: 55px; line-height: 1.3em; /* &:before { position: absolute; top: 0px; right: 30px; width: 50px; height: 50px; background-image: url(../images/house.png); background-repeat: no-repeat; background-size: contain; background-position: 50% 50%; content: ''; }//house */ } #since_eng > .since > ul > li.status_info_main:after { position: absolute; top: 65px; left: 0; width: 100%; height: 1px; background-color: #ddd; content: ''; } #since_eng > .since > ul > li > em { color: #ffc700; } #since_eng > .since > ul > li > span { font-size: 20px; } #since_eng > .since > .since_info { width: 100%; } #since_eng > .since > .since_info > h2 { padding-bottom: 20px; padding-left: 0px; font-size: 50px; font-weight: 500; font-style: italic; letter-spacing: -4px; color: #eee; } #since_eng > .since > .since_info > div { width: 100%; margin: 10px auto 0; border-bottom: 1px dotted #ddd; } #since_eng > .since > .since_info > div > ul { padding-left: 0px; width: 100%; } #since_eng > .since > .since_info > div > ul > li { float: inherit; margin-left: 0px; line-height: 1.45em; } #since_eng > .since > .since_info > div > ul > li:first-child { display: none; font-size: 40px; font-weight: 900; color: #ddd; } #since_eng > .since > .since_info > div > ul > li > dl { padding: 5px 0px; width: 100%; } #since_eng > .since > .since_info > div > ul > li > dl > dd { position: relative; font-size: 14px; font-weight: 500; padding-bottom: 10px; } #since_eng > .since > .since_info > div > ul > li > dl > dd:after { position: absolute; top: 11px; transform: translateY(-50%); left: -10px; width: 5px; height: 5px; border-radius: 15px; background-color: #ffc700; content: ''; } } /*certificate*/ #certificate_eng { width: 100%; padding-bottom: 20px; margin-bottom: 0px; height: auto; background-color: #fff; } #certificate_eng > .certificate_eng { position: relative; width: 1000px; margin: 0 auto; } #certificate_eng > .certificate_eng > ul { margin-top: 80px; width: 100%; } #certificate_eng > .certificate_eng > ul > li { margin-top: 20px; font-size: 15px; font-weight: 600; color: #333; line-height: 2em; } #certificate_eng > .certificate_eng > ul > li.status_info_main { position: relative; font-size: 30px; font-weight: 700; color: #263d78; margin-bottom: 55px; line-height: 1.3em; } #certificate_eng > .certificate_eng > ul > li.status_info_main:after { position: absolute; top: 65px; left: 0; width: 100%; height: 1px; background-color: #ddd; content: ''; } #certificate_eng > .certificate_eng > ul > li > em { color: #ddd; } #certificate_eng > .certificate_eng > ul > li > span { font-size: 20px; } #certificate_eng > .certificate_eng > .certificate_info_eng { width: 100%; } #certificate_eng > .certificate_eng > .certificate_info_eng > div { width: 100%; } #certificate_eng > .certificate_eng > .certificate_info_eng > div > ul > li { float: left; margin: 0 47px 50px 0; width: 300px; height: 400px; border: 1px dotted #eee; } #certificate_eng > .certificate_eng > .certificate_info_eng > div > ul > li:last-child { margin-right: 0; } #certificate_eng > .certificate_eng > .certificate_info_eng > div > ul > li > dl > dt { width: 100%; height: 350px; text-indent: -99999px; background-position: 50% 50%; background-repeat: no-repeat; background-size: cover; } #certificate_eng > .certificate_eng > .certificate_info_eng > div > ul > li > dl > dd { padding-top: 5px; font-size: 15px; font-weight: 600; text-align: center; line-height: 20px; } #certificate_eng > .certificate_eng > .certificate_info_eng > .sect01_eng > ul > li:nth-child(1) > dl > dt { background-image: url(../images/certificate_01.png); } #certificate_eng > .certificate_eng > .certificate_info_eng > .sect01_eng > ul > li:nth-child(2) > dl > dt { background-image: url(../images/certificate_02.png); } #certificate_eng > .certificate_eng > .certificate_info_eng > .sect01_eng > ul > li:nth-child(3) > dl > dt { background-image: url(../images/certificate_03.png); } #certificate_eng > .certificate_eng > .certificate_info_eng > .sect02_eng > ul > li:nth-child(1) > dl > dt { background-image: url(../images/certificate_04.png); } #certificate_eng > .certificate_eng > .certificate_info_eng > .sect02_eng > ul > li:nth-child(2) > dl > dt { background-image: url(../images/certificate_05.png); } #certificate_eng > .certificate_eng > .certificate_info_eng > .sect02_eng > ul > li:nth-child(3) > dl > dt { background-image: url(../images/certificate_06.png); } #certificate_eng > .certificate_eng > .certificate_info_eng > .sect03_eng > ul > li:nth-child(1) > dl > dt { background-image: url(../images/certificate_07.png); } #certificate_eng > .certificate_eng > .certificate_info_eng > .sect03_eng > ul > li:nth-child(2) > dl > dt { background-size: contain; background-image: url(../images/certificate_09.png); background-position: 50% 50%; } #certificate_eng > .certificate_eng > .certificate_info_eng > .sect03_eng > ul > li:nth-child(3) > dl > dt { background-size: contain; background-image: url(../images/certificate_10.png); background-position: 50% 50%; } @media screen and (max-width: 768px) { #certificate_eng { width: 100%; margin-bottom: 0 auto 0; height: auto; background-color: #fff; } #certificate_eng > .index_tap > p > span > a { padding-right: 240px; } #certificate_eng > .certificate_eng { position: relative; width: 100%; margin: 0 auto; } #certificate_eng > .certificate_eng > ul { margin-top: 80px; width: 100%; } #certificate_eng > .certificate_eng > ul > li { width: 100%; text-align: center; margin-top: 20px; font-size: 15px; font-weight: 600; color: #333; line-height: 2em; } #certificate_eng > .certificate_eng > ul > li.status_info_main { position: relative; font-size: 22px; font-weight: 700; color: #263d78; margin-bottom: 55px; line-height: 1.3em; } #certificate_eng > .certificate_eng > ul > li.status_info_main:after { position: absolute; top: 65px; left: 0; width: 100%; height: 1px; background-color: #ddd; content: ''; } #certificate_eng > .certificate_eng > ul > li > em { color: #ddd; } #certificate_eng > .certificate_eng > ul > li > span { font-size: 20px; } #certificate_eng > .certificate_eng > .certificate_info_eng { width: 100%; } #certificate_eng > .certificate_eng > .certificate_info_eng > div { width: 100%; } #certificate_eng > .certificate_eng > .certificate_info_eng > div > ul { width: 100%; } #certificate_eng > .certificate_eng > .certificate_info_eng > div > ul > li { float: inherit; margin: 0 0px 50px 0; width: 100%; height: 400px; border: 1px dotted #eee; border-top: none; border-left: none; border-right: none; } #certificate_eng > .certificate_eng > .certificate_info_eng > div > ul > li:last-child { margin-right: 0; } #certificate_eng > .certificate_eng > .certificate_info_eng > div > ul > li > dl > dt { width: 100%; height: 350px; text-indent: -99999px; background-position: 50% 50%; background-repeat: no-repeat; background-size: contain; } #certificate_eng > .certificate_eng > .certificate_info_eng > div > ul > li > dl > dd { font-size: 15px; font-weight: 600; text-align: center; line-height: 50px; } #certificate_eng > .certificate_eng > .certificate_info_eng > .sect01_eng > ul > li:nth-child(1) > dl > dt { background-image: url(../images/certificate_01.png); } #certificate_eng > .certificate_eng > .certificate_info_eng > .sect01_eng > ul > li:nth-child(2) > dl > dt { background-image: url(../images/certificate_02.png); } #certificate_eng > .certificate_eng > .certificate_info_eng > .sect01_eng > ul > li:nth-child(3) > dl > dt { background-image: url(../images/certificate_03.png); } #certificate_eng > .certificate_eng > .certificate_info_eng > .sect02_eng > ul > li:nth-child(1) > dl > dt { background-image: url(../images/certificate_04.png); } #certificate_eng > .certificate_eng > .certificate_info_eng > .sect02_eng > ul > li:nth-child(2) > dl > dt { background-image: url(../images/certificate_05.png); } #certificate_eng > .certificate_eng > .certificate_info_eng > .sect02_eng > ul > li:nth-child(3) > dl > dt { background-image: url(../images/certificate_06.png); } #certificate_eng > .certificate_eng > .certificate_info_eng > .sect03_eng > ul > li:nth-child(1) > dl > dt { background-image: url(../images/certificate_07.png); } #certificate_eng > .certificate_eng > .certificate_info_eng > .sect03_eng > ul > li:nth-child(2) > dl > dt { background-size: contain; background-image: url(../images/certificate_09.png); background-position: 50% 50%; } #certificate_eng > .certificate_eng > .certificate_info_eng > .sect03_eng > ul > li:nth-child(3) > dl > dt { background-size: contain; background-image: url(../images/certificate_10.png); background-position: 50% 50%; } } #research { width: 100%; background-color: white; } #research > .inner { width: 100%; height: 180px; padding-top: 60px; margin: 0 auto; background-image: url(../images/research_m01.jpg); } #research > .inner > h2 { position: relative; text-align: center; font-size: 35px; font-weight: 600; margin-bottom: 50px; color: #fff; } #research > .inner > h2:after { position: absolute; top: 60px; left: 50%; transform: translate(-50%, -50%); width: 120px; height: 4px; border: 3px dotted #ffc700; content: ''; } #research > .inner > .threeTap { width: 100%; } #research > .inner > .threeTap ul { width: 1370px; margin: 0 auto; } #research > .inner > .threeTap ul > li { display: block; float: left; margin: 0 10px; font-size: 20px; font-weight: 600; color: #fff; cursor: default; } #research > .research { padding-top: 130px; margin-bottom: 100px; width: 100%; } #research > .research > div { width: 100%; } #research > .research > div > ul > li { float: left; width: 50%; height: 450px; background-size: contain; background: no-repeat; background-position: 50% 50%; } #research > .research > div > ul > li:first-child { text-indent: -99999px; } #research > .research > div > ul > li:last-child { height: 240px; margin-top: 120px; } #research > .research > div > ul > li:last-child > dl { padding-left: 100px; } #research > .research > div > ul > li:last-child > dl > dt { position: relative; font-size: 30px; font-weight: 500; margin-bottom: 30px; color: #333; } #research > .research > div > ul > li:last-child > dl > dt:after { position: absolute; top: 60px; left: 0; width: 60px; height: 4px; background-color: #ffc700; content: ''; } #research > .research > div > ul > li:last-child > dl > dt > span { padding-left: 4px; font-size: 16px; color: #263d78; font-weight: 500; } #research > .research > div > ul > li:last-child > dl > dd { position: relative; line-height: 2em; padding-left: 20px; color: #aaa; } #research > .research > div > ul > li:last-child > dl > dd:after { position: absolute; top: 18px; left: 5px; transform: translateY(-50%); width: 5px; height: 5px; background-color: #263d78; border-radius: 7px; content: ''; } #research > .research > div.research_01 > ul > li:first-child { background-image: url(../images/camera.png); background-size: contain; } #research > .research > div.research_02 { width: 100%; height: 100%; background-image: url(../images/bg_2.png); } #research > .research > div.research_02 > ul > li > dl dt { color: #fff; } #research > .research > div.research_02 > ul > li > dl dd { color: #fff; } #research > .research > div.research_02 > ul > li:first-child { background-image: url(../images/crack.png); background-size: contain; } #research > .research > div.research_03 > ul > li:first-child { background-image: url(../images/moon.png); background-size: contain; background-repeat: no-repeat; } @media screen and (max-width: 768px) { #research { width: 100%; background-color: white; } #research > .inner { height: 250px; padding-top: 30px; margin: 0 auto; background-image: url(../images/research_m01.jpg); } #research > .inner > h2 { position: relative; text-align: center; font-size: 22px; font-weight: 600; margin-bottom: 50px; } #research > .inner > h2:after { position: absolute; top: 50px; left: 50%; transform: translate(-50%, -50%); width: 120px; height: 4px; border: 3px dotted #ffc700; content: ''; } #research > .inner > .threeTap { width: 100%; height: 100%; } #research > .inner > .threeTap ul { width: 100%; margin: 0 auto; } #research > .inner > .threeTap ul > li { display: block; float: inherit; text-align: center; margin: 10px 20px; font-size: 20px; font-weight: 600; color: #fff; cursor: default; } #research > .category { position: fixed; bottom: 0; width: 100%; border-bottom: 1px solid #ddd; z-index: 99999; } #research > .category > ul { margin: 0 auto; width: 100%; } #research > .category > ul > li { float: left; width: 25%; height: 40px; line-height: 40px; text-align: center; font-weight: 600; margin-right: 0px; background-color: #eee; color: #555; cursor: pointer; } #research > .category > ul > li:last-child { margin-right: 0; border-bottom: none; } #research > .category > ul > li:hover { color: #fff; background-color: #263d78; } #research > .category > ul > li.on { color: #fff; background-color: #263d78; } #research > .research { padding-top: 0px; width: 100%; background-image: url(../images/bus_bg.jpg); } #research > .research > div { width: 100%; margin-top: 30px; } #research > .research > div:first-child { margin-top: 0; } #research > .research > div > ul > li { float: inherit; width: 100%; height: 550px; background-size: contain; background: no-repeat; background-position: 50% 50%; } #research > .research > div > ul > li:first-child { height: 200px; float: inherit !important; text-indent: -99999px; } #research > .research > div > ul > li:last-child { height: auto; margin-top: 20px; } #research > .research > div > ul > li:last-child > dl { width: 90%; padding-left: 0px; margin: 0 auto; } #research > .research > div > ul > li:last-child > dl > dt { position: relative; font-size: 30px; font-weight: 500; margin-bottom: 30px; color: #333; } #research > .research > div > ul > li:last-child > dl > dt:after { display: none; position: absolute; top: 50px; left: 0; width: 60px; height: 4px; background-color: #ffc700; content: ''; } #research > .research > div > ul > li:last-child > dl > dt > span { padding-left: 4px; font-size: 16px; color: #263d78; font-weight: 500; } #research > .research > div > ul > li:last-child > dl > dd { position: relative; line-height: 2em; padding-left: 20px; color: #aaa; } #research > .research > div > ul > li:last-child > dl > dd > br { display: none; } #research > .research > div > ul > li:last-child > dl > dd:after { position: absolute; top: 18px; left: 5px; transform: translateY(-50%); width: 5px; height: 5px; background-color: #263d78; border-radius: 7px; content: ''; } #research > .research > div.research_01 > ul > li:first-child { background-image: url(../images/camera.png); background-size: contain; } #research > .research > div.research_02 { width: 100%; height: 100%; background-image: url(../images/bg_2.png); } #research > .research > div.research_02 > ul > li > dl dt { color: #fff; } #research > .research > div.research_02 > ul > li > dl dd { color: #fff; } #research > .research > div.research_02 > ul > li:first-child { background-image: url(../images/crack.png); background-size: contain; } #research > .research > div.research_03 > ul > li:first-child { background-image: url(../images/moon.png); background-size: contain; background-repeat: no-repeat; } } /*business*/ #business_eng { width: 100%; background-color: white; } #business_eng > .inner { height: 100px; padding-top: 130px; margin: 0 auto 130px; } #business_eng > .inner > h2 { position: relative; text-align: center; font-size: 35px; font-weight: 600; margin-bottom: 50px; } #business_eng > .inner > h2:after { position: absolute; top: 60px; left: 50%; transform: translate(-50%, -50%); width: 120px; height: 4px; border: 3px dotted #ffc700; content: ''; } #business_eng > .inner p { text-align: center; font-size: 17px; letter-spacing: -1px; color: #999; line-height: 1.45em; } #business_eng > .category { width: 100%; border-bottom: 1px solid #eee; } #business_eng > .category > ul { margin: 0 auto; width: 850px; } #business_eng > .category > ul > li { float: left; width: 24%; height: 40px; line-height: 40px; text-align: center; font-weight: 600; margin-right: 3px; background-color: #ddd; color: #555; cursor: pointer; } #business_eng > .category > ul > li:last-child { margin-right: 0; } #business_eng > .category > ul > li:hover { color: #fff; background-color: #263d78; } #business_eng > .category > ul > li.on { color: #fff; background-color: #263d78; } #business_eng > .business { padding-top: 130px; width: 100%; background-image: url(../images/bus_bg.jpg); } #business_eng > .business > div { width: 100%; } #business_eng > .business > div > ul > li { float: left; width: 50%; height: 450px; background-size: contain; background: no-repeat; background-position: 50% 50%; } #business_eng > .business > div > ul > li:first-child { text-indent: -99999px; } #business_eng > .business > div > ul > li:last-child { height: 240px; margin-top: 120px; } #business_eng > .business > div > ul > li:last-child > dl { padding-left: 50px; } #business_eng > .business > div > ul > li:last-child > dl > dt { position: relative; font-size: 40px; font-weight: 500; margin-bottom: 30px; color: #333; } #business_eng > .business > div > ul > li:last-child > dl > dt:after { position: absolute; top: 60px; left: 0; width: 60px; height: 4px; background-color: #ffc700; content: ''; } #business_eng > .business > div > ul > li:last-child > dl > dt > span { padding-left: 4px; font-size: 16px; color: #263d78; font-weight: 500; } #business_eng > .business > div > ul > li:last-child > dl > dd { position: relative; line-height: 2em; padding-left: 20px; color: #aaa; } #business_eng > .business > div > ul > li:last-child > dl > dd:after { position: absolute; top: 18px; left: 5px; transform: translateY(-50%); width: 5px; height: 5px; background-color: #263d78; border-radius: 7px; content: ''; } #business_eng > .business > div.business_01 > ul > li:first-child { background-image: url(../images/business_ai2.png); background-size: contain; } #business_eng > .business > div.business_02 > ul > li:first-child { background-image: url(../images/bigdata.jpg); background-size: contain; } #business_eng > .business > div.business_02 > ul > li > dl > dd:nth-child(3):after { top: 50%; } #business_eng > .business > div.business_02 > ul > li > dl > dd:nth-child(4):after { top: 50%; } #business_eng > .business > div.business_03 > ul > li:first-child { background-image: url(../images/soc.jpg); background-size: contain; background-repeat: no-repeat; } #business_eng > .business > div.business_04 { padding-bottom: 100px; } #business_eng > .business > div.business_04 > ul > li:first-child { background-image: url(../images/si.jpg); background-size: cover; background-repeat: no-repeat; background-position: 0 88%; } @media screen and (max-width: 768px) { #business_eng { width: 100%; background-color: white; } #business_eng > .inner { height: 50px; padding-top: 60px; margin: 0 auto 130px; } #business_eng > .inner > h2 { position: relative; text-align: center; font-size: 22px; line-height: 1.3em; font-weight: 600; margin-bottom: 50px; } #business_eng > .inner > h2 > span { display: block; } #business_eng > .inner > h2:after { position: absolute; top: 80px; left: 50%; transform: translate(-50%, -50%); width: 120px; height: 4px; border: 3px dotted #ffc700; content: ''; } #business_eng > .inner p { width: 90%; margin: 0 auto; text-align: center; font-size: 15px; letter-spacing: -1px; color: #999; line-height: 1.45em; } #business_eng > .inner p > br { display: none; } #business_eng > .category { position: fixed; bottom: 0; width: 100%; border-bottom: 1px solid #ddd; z-index: 99999; } #business_eng > .category > ul { margin: 0 auto; width: 100%; } #business_eng > .category > ul > li { float: left; width: 25%; height: 40px; line-height: 40px; text-align: center; font-weight: 600; margin-right: 0px; background-color: #eee; color: #555; cursor: pointer; } #business_eng > .category > ul > li:last-child { margin-right: 0; border-bottom: none; } #business_eng > .category > ul > li:hover { color: #fff; background-color: #263d78; } #business_eng > .category > ul > li.on { color: #fff; background-color: #263d78; } #business_eng > .business { padding-top: 0px; width: 100%; background-image: url(../images/bus_bg.jpg); } #business_eng > .business > div { width: 100%; margin-top: 30px; } #business_eng > .business > div:first-child { margin-top: 0; } #business_eng > .business > div > ul > li { float: inherit; width: 100%; height: 550px; background-size: contain; background: no-repeat; background-position: 50% 50%; } #business_eng > .business > div > ul > li:first-child { height: 200px; float: inherit !important; text-indent: -99999px; } #business_eng > .business > div > ul > li:last-child { height: auto; margin-top: 20px; } #business_eng > .business > div > ul > li:last-child > dl { width: 90%; padding-left: 0px; margin: 0 auto; } #business_eng > .business > div > ul > li:last-child > dl > dt { position: relative; font-size: 30px; font-weight: 500; margin-bottom: 30px; color: #333; } #business_eng > .business > div > ul > li:last-child > dl > dt:after { position: absolute; top: 50px; left: 0; width: 60px; height: 4px; background-color: #ffc700; content: ''; } #business_eng > .business > div > ul > li:last-child > dl > dt > span { padding-left: 4px; font-size: 16px; color: #263d78; font-weight: 500; } #business_eng > .business > div > ul > li:last-child > dl > dd { position: relative; line-height: 2em; padding-left: 20px; color: #aaa; } #business_eng > .business > div > ul > li:last-child > dl > dd > br { display: none; } #business_eng > .business > div > ul > li:last-child > dl > dd:after { position: absolute; top: 18px; left: 5px; transform: translateY(-50%); width: 5px; height: 5px; background-color: #263d78; border-radius: 7px; content: ''; } #business_eng > .business > div.business_01 > ul > li:first-child { background-image: url(../images/business_ai2.png); background-size: contain; } #business_eng > .business > div.business_02 > ul > li:first-child { background-image: url(../images/bigdata.jpg); background-size: contain; } #business_eng > .business > div.business_03 > ul > li:first-child { background-image: url(../images/soc.jpg); background-size: cover; background-repeat: no-repeat; } #business_eng > .business > div.business_03 > ul > li:last-child > dl > dt:after { position: absolute; top: 80px; left: 0; width: 60px; height: 4px; background-color: #ffc700; content: ''; } #business_eng > .business > div.business_04 { padding-bottom: 40px; } #business_eng > .business > div.business_04 > ul > li:first-child { background-image: url(../images/si.jpg); background-size: cover; background-repeat: no-repeat; background-position: 50% 90%; } #business_eng > .business > div.business_04 > ul > li:last-child > dl > dt:after { position: absolute; top: 80px; left: 0; width: 60px; height: 4px; background-color: #ffc700; content: ''; } } /*contact*/ #faq_eng { position: relative; width: 100%; margin-bottom: 60px; height: 600px; background-color: #fff; } #faq_eng > .inner { width: 1000px; margin: 0 auto; } #faq_eng > .inner > .faq_info { float: left; width: 450px; margin: 0 auto; } #faq_eng > .inner > .faq_info > ul { margin-top: 80px; width: 100%; } #faq_eng > .inner > .faq_info > ul > li { margin-top: 20px; font-size: 14px; font-weight: 500; color: #333; line-height: 1.7em; } #faq_eng > .inner > .faq_info > ul > li:last-child { margin-top: 50px; font-size: 17px; font-weight: 600; } #faq_eng > .inner > .faq_info > ul > li > span { font-size: 20px; font-weight: 600; } #faq_eng > .inner > .faq_info > ul > li > em { color: #eee; } #faq_eng > .inner > .faq_info > ul > li.faq_info_main { position: relative; font-size: 29px; font-weight: 700; color: #263d78; margin-bottom: 55px; line-height: 1.3em; } #faq_eng > .inner > .faq_info > ul > li.faq_info_main:after { position: absolute; top: 65px; left: 0; width: 100%; height: 1px; background-color: #ddd; content: ''; } #faq_eng > .inner > .map { float: right; margin-top: 50px; width: 540px; height: 400px; border: 0; } @media screen and (max-width: 768px) { #faq_eng { position: relative; width: 100%; padding-bottom: 60px; margin-bottom: 0px; height: auto; background-color: #fff; } #faq_eng > .inner { width: 100%; margin: 0 auto; } #faq_eng > .inner > .faq_info { float: inherit; width: 90%; margin: 0 auto; } #faq_eng > .inner > .faq_info > ul { margin-top: 80px; width: 100%; } #faq_eng > .inner > .faq_info > ul > li { margin-top: 20px; font-size: 14px; font-weight: 500; color: #333; line-height: 1.7em; } #faq_eng > .inner > .faq_info > ul > li:last-child { border-top: 1px dotted #ddd; margin-top: 20px; padding-top: 10px; font-size: 14px; color: #263d78; font-weight: 600; } #faq_eng > .inner > .faq_info > ul > li > span { font-size: 17px; font-weight: 600; } #faq_eng > .inner > .faq_info > ul > li > em { color: #eee; } #faq_eng > .inner > .faq_info > ul > li.faq_info_main { position: relative; text-align: center; font-size: 22px; font-weight: 700; color: #263d78; margin-bottom: 55px; line-height: 1.3em; } #faq_eng > .inner > .faq_info > ul > li.faq_info_main:after { position: absolute; top: 65px; left: 0; width: 100%; height: 1px; background-color: #ddd; content: ''; } #faq_eng > .inner > .map { float: inherit; width: 100%; height: 450px; background-image: url(../images/map_eng_18.08.06.jpg); background-position: 10% 50%; background-size: cover; border: 0; } } footer { width: 100%; height: 170px; background-color: #333; } footer > .inner { position: relative; padding-top: 20px; } footer > .inner > h1 { float: left; margin-left: 40px; width: 120px; height: 40px; text-indent: -99999px; background-image: url(../images/logo.png); background-repeat: no-repeat; background-size: contain; background-position: 50% 50%; } footer > .inner > address { float: left; margin-top: 0px; margin-left: 30px; width: 350px; } footer > .inner > address > ul { width: 350px; } footer > .inner > address > ul > li { margin-left: 0px; width: 320px; text-align: center; } footer > .inner > address > ul > li:nth-child(1) dl dt { background-image: url(../images/f_icon_mail.png); } footer > .inner > address > ul > li:nth-child(2) dl dt { background-image: url(../images/f_icon_tel.png); } footer > .inner > address > ul > li:nth-child(3) dl dt { background-image: url(../images/f_icon_location.png); } footer > .inner > address > ul > li > dl > dt { margin: 0 auto; width: 50px; height: 50px; text-indent: -99999px; background-size: cover; background-repeat: no-repeat; background-position: 50% 50%; } footer > .inner > address > ul > li > dl > dd { text-align: left; margin-top: 8px; font-size: 15px; font-weight: 500; line-height: 1.2em; color: #fff; } footer > .inner > address > ul > li > dl > dd:nth-child(2) { font-weight: 700; } footer > .inner > address > ul > li > dl > dd:nth-child(3) { color: #909090; } footer > .inner > address > ul > li > dl > dd > a { font-size: 13px; color: #909090; } footer > .inner > address > ul > li > dl > dd > a:hover { text-decoration: underline; } footer > .inner > .f_nav { float: right; margin-top: 0px; width: 200px; } footer > .inner > .f_nav > ul > li { float: left; margin-right: 9px; padding-right: 11px; background-image: url(../images/f_right.png); background-repeat: no-repeat; background-position: 100% 73%; } footer > .inner > .f_nav > ul > li:last-child { margin-right: none; background-image: none; } footer > .inner > .f_nav > ul > li > a { font-size: 13px; color: #fff; } footer > .inner > .copyright { position: absolute; top: 120px; right: -140px; transform: translateX(-50%); width: 315px; font-size: 13px; letter-spacing: 1px; color: #fff; } footer > .inner:after { position: absolute; top: 30px; left: 180px; transform: translateX(-50%); width: 1px; height: 120px; background-color: #fff; content: ''; } @media screen and (max-width: 768px) { /*footer 768px 반응형*/ footer { width: 100%; height: auto; background-color: #333; } footer > .inner { position: relative; padding-top: 20px; } footer > .inner > h1 { float: inherit; margin: 0 auto 180px; width: 120px; height: 40px; text-indent: -99999px; background-image: url(../images/logo.png); background-repeat: no-repeat; background-size: contain; background-position: 50% 50%; } footer > .inner > .f_left { float: inherit; margin: 0 auto; width: 100%; } footer > .inner > .f_left > ul { width: 100%; } footer > .inner > .f_left > ul > li { width: 100%; } footer > .inner > .f_left > ul > li > dl > dt { display: none; margin: 0 auto; width: 100%; height: 50px; text-indent: -99999px; background-size: cover; background-repeat: no-repeat; background-position: 50% 50%; } footer > .inner > .f_left > ul > li > dl > dd { padding-left: 20px; text-align: left; margin-top: 8px; font-size: 16px; font-weight: 500; line-height: 1.2em; color: #fff; } footer > .inner > .f_left > ul > li > dl > dd > em { color: #909090; } footer > .inner > .f_left > ul > li > dl > dd:nth-child(2) { font-weight: 700; } footer > .inner > .f_left > ul > li > dl > dd:nth-child(3) { color: #909090; } footer > .inner > .f_left > ul > li > dl > dd > a { font-size: 13px; color: #909090; } footer > .inner > .f_left > ul > li > dl > dd > a:hover { text-decoration: none; } footer > .inner > address { border-top: 1px solid #666; float: inherit; margin: 10px 0; width: 100%; } footer > .inner > address > ul { width: 100%; } footer > .inner > address > ul > li { width: 100%; text-align: center; } footer > .inner > address > ul > li:nth-child(1) dl dt { background-image: url(../images/f_icon_mail.png); } footer > .inner > address > ul > li:nth-child(2) dl dt { background-image: url(../images/f_icon_tel.png); } footer > .inner > address > ul > li:nth-child(3) dl dt { background-image: url(../images/f_icon_location.png); } footer > .inner > address > ul > li > dl > dt { display: none; } footer > .inner > address > ul > li > dl > dd { padding-left: 25px; text-align: left; margin-top: 6px; font-size: 15px; font-weight: 500; line-height: 1.2em; color: #fff; } footer > .inner > address > ul > li > dl > dd:nth-child(2) { font-weight: 700; } footer > .inner > address > ul > li > dl > dd:nth-child(3) { color: #909090; } footer > .inner > address > ul > li > dl > dd > a { font-size: 13px; color: #909090; } footer > .inner > address > ul > li > dl > dd > a > span { display: block; } footer > .inner > address > ul > li > dl > dd > a > span > span { display: block; } footer > .inner > address > ul > li > dl > dd > a:hover { text-decoration: underline; } footer > .inner > .f_nav { position: absolute; top: 75px; float: inherit; margin-top: 0px; width: 100%; } footer > .inner > .f_nav > ul > li { width: 100%; text-align: center; float: inherit; margin-right: 0px; padding-right: 0px; background-image: none; background-repeat: no-repeat; background-position: 100% 73%; border-top: 1px solid #666; } footer > .inner > .f_nav > ul > li:last-child { margin-right: none; background-image: none; border-bottom: 1px solid #666; } footer > .inner > .f_nav > ul > li > a { display: block; height: 50px; line-height: 50px; font-size: 16px; color: #fff; } footer > .inner > .copyright { border-top: 1px solid #666; position: static; padding: 20px 0; top: 10px; right: 50%; transform: translateX(0); width: 100%; font-size: 13px; letter-spacing: 1px; text-align: center; color: #fff; } footer > .inner:after { display: none; } } /*# sourceMappingURL=common_eng.css.map */