@charset "utf-8";

.real-cont {padding:150px 0 180px;}
/* sub-visual */
.sub-visual {height:680px; background-repeat:no-repeat; background-size:cover; background-position:center center;}
.sub-visual .wrap {padding:80px 0; display:flex; height:100%; flex-direction:column; justify-content:flex-end;}
.sub-visual .title {margin-bottom:54px;}
.sub-visual .title h2 {font-size:70px; font-weight:600; color:#fff; line-height:1.2em; font-family:'Poppins'; margin-bottom:26px; opacity:0; position:relative; top:50px; transition:all 0.6s;}
.sub-visual .title p {font-size:24px; line-height:1.4em; color:#fff; opacity:0; position:relative; top:50px; transition:all 0.6s;}

.sub-visual.on .title h2 {top:0; opacity:1;}
.sub-visual.on .title p {top:0; opacity:1; transition-delay:0.2s;}
.sub-visual .lnb {max-width:240px; width:100%; margin:0 0 0 auto; display:flex; align-items:center; opacity:0; position:relative; left:100px; transition:all 0.6s;}
.sub-visual.on .lnb {opacity:1; left:0; transition-delay:0.6s;}

.sub-visual .lnb .home {display:block; max-width:40px; width:100%; height:40px; background:#4ab9ea url('../img/sub/home.png') center center no-repeat; border-radius:50%; transition:all 0.6s;}
.sub-visual .lnb .home:hover {background-color:rgba(17,17,17,0.8);} 
.sub-visual .lnb .nav {width:1%; flex:1 1 auto; padding-left:20px; position:relative; z-index:11;}
.sub-visual .lnb .nav .tit {padding:0 10px; font-size:18px; line-height:39px; border-bottom:1px solid rgba(255,255,255,0.6); position:relative; color:#fff;}
.sub-visual .lnb .nav .tit:after {content:''; width:12px; height:8px; background:url('../img/sub/lnb-arrow.png') no-repeat; background-size:cover; position:absolute; top:50%; margin-top:-4px; right:10px; transition:all .6s;}
.sub-visual .lnb .nav.open .tit:after {transform:rotate(180deg);}
.sub-visual .lnb .nav ul {position:absolute; height:0; opacity:0; top:50px; right:0; max-width:180px; width:100%; z-index:11; transition:all 0.6s; background:#fff; border-radius:10px; box-shadow:0 5px 10px 0 rgba(0,0,0,0.07); overflow:hidden;}
.sub-visual .lnb .nav.open ul {height:auto; opacity:1;}
.sub-visual .lnb .nav ul li {border-bottom:1px solid #ddd;}
.sub-visual .lnb .nav ul li:last-child {border-bottom:0;}
.sub-visual .lnb .nav ul li a {display:block; padding:0 30px; background:#fff; font-size:18px; line-height:54px; color:#666; transition:all 0.6s;}
.sub-visual .lnb .nav ul li.active a {background:#4ab9ea; color:#fff;}
.sub-visual .lnb .nav ul li a:hover {background:#4ab9ea; color:#fff;}
/* sub 01 01 */
.outline .tit {text-align:center; margin-bottom:100px;}
.outline .tit h3 {font-size:54px; font-weight:600; color:#000; line-height:1.37em;}
.outline .cnt {margin-bottom:-100px;}
.outline .col {display:flex; align-items:center; margin-bottom:100px;}
.outline .col .img-box {max-width:720px; width:100%;}
.outline .col .txt-box {width:1%; flex:1 1 auto; padding-left:120px;}
.outline .col .txt-box h4 {font-size:40px; line-height:1.3em; color:#000; font-weight:600; margin-bottom:32px; font-family:'Poppins';}
.outline .col .txt-box p {font-size:20px; color:#666; line-height:1.6em;}
/* sub common */
.doc-cnt {height:550px; display:flex; justify-content:center; align-items:center; flex-direction:column; padding:0 15px; color:#fff; background-repeat:no-repeat; background-position:center center; background-size:cover; text-align:center;}
.doc-cnt p {font-size:20px; line-height:1.6em; font-family:'Poppins'; margin-bottom:24px; font-weight:600;}
.doc-cnt h3 {font-size:54px; line-height:1.3em; font-weight:600;}
/* sub 01 02 */
.greeting .doc-cnt {background-image:url('../img/sub/greeting-doc.jpg'); margin-bottom:110px;}
.greeting .col {display:flex; margin:0 -50px;}
.greeting .col .row {width:50%; padding:0 50px; position:relative;}
.greeting .col .row p {font-size:20px; line-height:1.6em; color:#666; margin-bottom:36px;}
.greeting .col .row .sign {position:absolute; bottom:0; right:0; font-size:20px; line-height:1.6em; font-weight:600; color:#000;}
.greeting .col .row .sign img {display:inline-block; vertical-align:middle; margin-left:30px; margin-top:-.2em;}
/* sub 01 03 */
.vision .real-cont {padding-bottom:0;}
.vision .doc-cnt {background-image:url('../img/sub/vision-doc.jpg');}
.vision .doc-cnt p {font-size:54px; line-height:1.3em; font-weight:600; font-family:'Poppins'; margin-bottom:28px;}
.vision .doc-cnt h3 {font-size:20px; line-height:1.6em; font-weight:400;}
.vision .tit {text-align:center; margin-bottom:100px;}
.vision .tit h3 {font-size:54px; line-height:1.3em; font-weight:600; color:#000;}
.vision .col {display:flex;	 margin:0 -50px 200px;}
.vision .col .row {width:50%; padding:0 50px;}
.vision .col .row p {font-size:20px; line-height:1.6em; color:#666; margin-top:40px; padding:0 10px;}
/* sub 01 04 */
.history .doc-cnt {background-image:url('../img/sub/history-doc.jpg'); margin-bottom:110px;}
.history .col {display:flex; border-bottom:1px solid #ddd; padding-bottom:110px;}
.history .year {width:400px; padding:0 120px; font-size:54px; line-height:1.1em; color:#000; font-weight:600; font-family:'Poppins'; position:relative;}
.history .year:before {content:''; width:1px; height:calc(100% + 100px); background:#ddd; position:absolute; right:0; top:10px;}
.history .year:after {content:''; width:12px; height:12px; border-radius:50%; border:3px solid #4ab9ea; background:#fff; position:absolute; top:10px; right:-6px;}
.history .txt-box {width:1%; flex:1 1 auto; padding-left:130px;}
.history .txt-box .txt {display:flex; margin-bottom:30px;}
.history .txt-box .txt:last-child {margin-bottom:0;}
.history .txt-box .txt .month {width:110px; font-size:20px; font-weight:500; color:#000; line-height:1.5em;}
.history .txt-box .txt ul {width:1%; flex:1 1 auto;}
.history .txt-box .txt ul li {font-size:20px; line-height:1.5em; color:#666;}
/* sub 03 */
.reference {}
.reference.gallery-list ul {margin-left:-60px;}
.reference.gallery-list ul li {width:calc(33.33333333% - 60px); margin-left:60px; margin-bottom:60px;}
.reference.gallery-list ul li a {border-radius:20px; padding:20px;}
.reference.gallery-list ul li a:hover {border-color:#4ab9ea; box-shadow:none;}
.reference.gallery-list ul li a .thumb .pic {padding-bottom:61.81%;}
.reference.gallery-list ul li a .tit {height:calc(1.5em * 1 * 1); -webkit-line-clamp:1; text-align:center; font-size:20px; transition:all 0s;}
.reference.gallery-list ul li a:hover .tit  {color:#000; font-weight:600;}
/* sub 03 view */
.reference-view .cnt {margin-bottom:110px;}
.reference-view .cnt .col {display:flex;}
.reference-view .cnt .img-box {max-width:720px; width:100%;}
.reference-view .cnt .img-box .pic {position:relative; height:0; padding-bottom:69.44%; overflow:hidden; transition:all 0.6s;}
.reference-view .cnt .img-box .pic img {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100% !important; height:100% !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s;}

.reference-view .cnt .txt-box {width:1%; flex:1 1 auto; padding-left:120px;}
.reference-view .cnt .txt-box h3 {font-size:44px; line-height:1.2em; font-weight:600; margin-bottom:40px; color:#000;}
.reference-view .cnt .txt-box p {font-size:20px; line-height:1.6em; color:#666; margin-bottom:70px;}
.reference-view .cnt .box {display:flex; background:#f6f7f8; border-radius:10px;}
.reference-view .cnt .txt {width:50%; border-right:1px solid #ddd; padding:44px 50px;}
.reference-view .cnt .txt:last-child {border-right:0;}
.reference-view .cnt .txt h4 {display:block; width:calc(100% - 30px); margin-left:15px; font-size:18px; line-height:1.5em; font-weight:500; color:#fff; border-radius:5px; text-align:center; padding:4px 10px; margin-bottom:18px;}
.reference-view .cnt .txt:nth-child(1) h4 {background:#4ab9ea;}
.reference-view .cnt .txt:nth-child(2) h4 {background:#f6a91d;}
.reference-view .cnt .txt li {font-size:18px; line-height:1.8em; color:#666; position:relative; padding-left:12px;}
.reference-view .cnt .txt li:before {content:''; width:3px; height:3px; border-radius:50%; position:absolute; left:0; top:12px;}
.reference-view .cnt .txt:nth-child(1) li:before {background:#4ab9ea;}
.reference-view .cnt .txt:nth-child(2) li:before {background:#f6a91d;}

.reference-view .form-cnt {margin-bottom:150px;}
.reference-view .form-cnt .col {display:flex; margin-bottom:90px;}
.reference-view .form-cnt .col:last-child {margin-bottom:0;}
.reference-view .form-cnt .tit {max-width:300px; width:100%;}
.reference-view .form-cnt .tit h4 {font-size:36px; font-weight:600; color:#000; line-height:1.2em;}
.reference-view .form-cnt .txt {width:1%; flex:1 1 auto; padding:10px; border-bottom:1px solid #ddd;}
.reference-view .form-cnt .txt a.file {display:block; position:relative; font-size:20px; line-height:54px; color:#666; padding-left:75px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.reference-view .form-cnt .txt a.file:before {content:''; width:54px; height:54px; background:url('../img/sub/file.png') no-repeat; background-size:cover; position:absolute; top:50%; margin-top:-27px; left:0;}
.reference-view .form-cnt .txt.account {min-height:280px;}
.reference-view .form-cnt .txt.account p {font-size:20px; line-height:1.6em; color:#666;}