*{margin: 0; padding: 0;}
li{list-style: none;}
a{text-decoration: none;}
img{vertical-align: top; max-width: 100%; height: auto;}
/**/
html, body {font-family: 'Noto Sans KR', sans-serif; overflow-x: hidden; background-color: #fff;}
.wrap {width: 100%; max-width: 1200px; position: relative; margin: 0 auto;}
.wrap:after, ul:after {clear: both; content: ""; display: block;}

@media screen and (max-width : 768px){
    .pc {display: none !important;}
}
@media screen and (min-width : 769px){
    .mob {display: none !important;}
}

/**/
.pf_visual {height: 100vh; background: url(../img/cau_bg.jpg); background-attachment: fixed; background-size: cover; background-position: top center;}
.pf_visual .wrap {height: 100%;}
.pf_visual dl {display: flex; justify-content: center; align-items: center; flex-direction: column; color: #fff; height: 100%; text-align: center;}
.pf_visual dl dt {font-size: 20px;}
.pf_visual dl dd {font-size: 60px; font-weight: bold;}

@media screen and (max-width:768px){
    .pf_visual dl dd {font-size: 25px;}
}

.gem_next {height: 560px; position: relative; overflow: hidden;}

.gem_next .link {position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 888;}

.gem_next .bg{position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5);}

.cau_next {background-image: url(/html/portfolio/2020/img/asf_visual.jpg); background-position: center center; background-repeat: no-repeat; position: relative;}

.gem_next .textbox {position: absolute; top: 150px; color: #fff; z-index: 10; width: 95%; max-width: 1200px; left: 50%; transform: translateX(-50%);}
.gem_next .textbox dl dt {font-size: 20px; font-family: 'Poppins', sans-serif; font-weight: normal;}
.gem_next .textbox dl dd {font-size: 60px; font-weight: bold;}

@media screen and (max-width: 768px) {
    
    .gem_next {height: 250px;} 
    .gem_next .textbox {top: 50px;}
    .gem_next .textbox dl dd {font-size: 24px;}
    
}

.gem06_link {padding: 130px 0 60px; text-align: center; background: #fff;}
.gem06_link a {color: #333; font-size: 30px; font-weight: 600;}
.gem06_link span {position: relative; top: -5px; margin-right: 20px;}
.gem06_link img {vertical-align: middle;}

@media screen and (max-width: 768px) {
    
    .gem06_link {padding: 70px 0 60px;}
    .gem06_link a {font-size: 20px;}
    
}

.cau_01 dl {padding: 110px 0 120px;}
.cau_01 dl dt {margin-bottom: 40px; font-size: 30px; font-family: 'Poppins', sans-serif; color: #222; font-weight: bold;}
.cau_01 dl dd:nth-of-type(1) {margin-bottom: 45px; font-size: 18px; color: #666;}

.cau_01 dl dd:nth-of-type(2) {width: 180px; height: 47px; background: #333333; text-align: center;}
.cau_01 dl dd:nth-of-type(2) a {display: inline-block; width: 100%; height: 100%; line-height: 47px; color: #fff; box-sizing: border-box; padding-right: 30px; background-image: url(../img/cau_arrow.png); background-repeat: no-repeat; background-position: 90% center;}

@media screen and (max-width:768px){

    .cau_01 {text-align: center;}
    .cau_01 dl {padding: 80px 0 90px;}
    .cau_01 dl dt {margin-bottom: 20px; font-size: 26px;}
    .cau_01 dl dd:nth-of-type(1) {font-size: 16px; word-break: keep-all;}

    .cau_01 dl dd:nth-of-type(2) {margin: 0 auto;}
    
}

.cau_02 {background: #e5f2ff; padding-bottom: 200px; background-image: url(/html/portfolio/cau/img/cau_02_bg.png); background-position: bottom center; background-repeat: no-repeat;}

.cau_02 .imgbg {position: relative; top: -15em; margin-bottom: -15em; margin-top: 200px;}
.cau_02 .imgbg:after {content: ""; display: block; padding-bottom: 120%;}
.cau_02 .imgbox {border: 12px solid #000; padding-bottom: 55%; content: ""; border-radius: 20px; position: relative;}
.cau_02 .imgbg img {position: absolute; top: 0; left: 0;box-sizing: border-box; padding: 12px 12px 0 12px; border-radius: 10px 10px 0 0;}

.cau_02 .imgulbox {position: relative;}
.cau_02 .imgul {display: table; margin-left: auto; margin-top: 120px;}
.cau_02 .imgul li {float: left; width: calc(100%/3);}
.cau_02 .imgul li:nth-of-type(2) {margin-top: 190px;}
.cau_02 .imgul li:nth-of-type(3) {margin-top: calc(190px*2);}

.cau_02 .imgulbox dl {position: absolute; left: 0; bottom: 0;}
.cau_02 .imgulbox dl dt {font-size: 30px; margin-bottom: 30px; font-weight: bold;}
.cau_02 .imgulbox dl dd {font-size: 18px; color: #666666;}

@media screen and (max-width:768px){
    .cau_02 {margin-top: 125px; padding-bottom: 120px;}
    
    .cau_02 .imgbg {top: -10em; margin-bottom: -10em; margin-top: 0;}
    .cau_02 .imgul {margin-top: 50px; margin-bottom: 100px;}
    .cau_02 .imgul li {float: left; width: calc(100%/2);}
    .cau_02 .imgul li:after {clear: both; content: ""; display: block;}
    .cau_02 .imgul li:nth-of-type(3) {margin-top:0; float: none; position: relative; top: -10em; margin-bottom: -10em;}
    
    .cau_02 .imgulbox dl {position: static; text-align: center;}
    .cau_02 .imgulbox dl dt {font-size: 20px; margin-bottom: 30px;}
    .cau_02 .imgulbox dl dd {font-size: 14px;}
    
}


/**/

.cau_03 .layout {height: 620px; background-image: url(/html/portfolio/cau/img/cau_layout.jpg); background-position: center center; background-attachment: fixed; background-repeat: no-repeat;}

@media screen and (max-width:768px){
    .cau_03 .layout {height: 450px; background-size: cover; background-attachment: scroll;}
}

/**/
.cau_04 {margin-bottom: 50px;}
.cau_04 .title {margin-top: 170px; text-align: center; margin-bottom: 80px;}
.cau_04 .title dt {font-size: 40px; margin-bottom: 40px; font-weight: bold; font-family: 'Poppins', sans-serif; font-weight: bold;}
.cau_04 .title dd {font-size: 20px; color: #656565;}
.cau_04 .top_ul {box-sizing: border-box; padding: 0 100px; margin-bottom: 240px;}
.cau_04 .top_ul li {float: left; width: calc(100%/3 - 200px/3); margin-right: 100px; border-radius: 100%;}
.cau_04 .top_ul li:after {content: ""; display: block; padding-bottom: 100%;}
.cau_04 .top_ul li:last-child {margin-right: 0;}

.cau_04 .top_ul li:nth-of-type(1) {background: #1e71c1;}
.cau_04 .top_ul li:nth-of-type(2) {background: #bf121a;}
.cau_04 .top_ul li:nth-of-type(3) {background: #ffd969;}

.cau_04 .m_title {font-size: 80px; margin-bottom: 40px;}
.cau_04 .m_title h2 { font-family: 'Poppins', sans-serif; font-weight: bold;}
.cau_04 .m_title dt {font-size: 30px; margin-bottom: 10px; font-weight: bold;}
.cau_04 .m_title dd {font-size: 18px; color: #666666;}

.cau_04 .b_box {background-image: url(/html/portfolio/cau/img/cau_04_img01.png); background-repeat: no-repeat; background-position:  20% top; position: relative; margin: 0 8%; padding-top: 5%;}
.cau_04 .b_box ul {position: relative;  padding-top:12%; box-sizing: border-box; padding-bottom: 80px;} 
.cau_04 .b_box li:nth-of-type(1) {position: absolute; right: 0; top: 0; margin-left: 33%;}
.cau_04 .b_box li:nth-of-type(2) {position: relative; z-index: 2; margin-right: 45%;}

.cau_04 .b_box figure {position: absolute; bottom: 0; padding-left: 60%;}



@media screen and (max-width:768px){
    
    .cau_04 {margin-bottom: 80px;}
    .cau_04 .title {margin-top: 60px; margin-bottom:50px;}
    .cau_04 .title dt {font-size: 30px; margin-bottom: 30px;}
    .cau_04 .title dd {font-size: 18px;}
    .cau_04 .top_ul {padding: 0; margin-bottom: 100px;}
    .cau_04 .top_ul li {width: calc(100%/3 - 10%/3); margin-right: 5%;}

    .cau_04 .m_title {font-size: 30px; text-align: center; margin-bottom: 0;}
    .cau_04 .m_title dt {font-size: 18px;}
    .cau_04 .m_title dd {font-size: 12px;}

    .cau_04 .b_box {background-position:  20% top; position: relative; margin: 0 8%; padding-top: 20%; background-size: contain; margin-top: 40px;}
    
    .cau_04 .b_box ul {padding-top:12%;padding-bottom: 50px;} 
    .cau_04 .b_box li:nth-of-type(1) {position: static; right: 0; top: 0; margin-bottom: 10px; margin-left: 0;}
    .cau_04 .b_box li:nth-of-type(2) {margin-right: 0;}

    .cau_04 .b_box dl {position: static; bottom: 0; padding-left:0; padding-right: 0; text-align: center;}
    .cau_04 .b_box dl dt {font-size: 18px; margin-bottom: 15px;}
    .cau_04 .b_box dl dd {font-size: 12px; word-break: keep-all;}
    
}


/**/

.cau_05 {background: url(/html/portfolio/cau/img/cau_05_bg.png); padding-top: 250px; background-repeat: no-repeat; background-position: center top; }

.cau_05 .ulbox {position: relative;}
.cau_05 li:nth-of-type(1) {padding-bottom: 20%;}
.cau_05 li:nth-of-type(2) {position: absolute; right:-4em; bottom: 0; margin-left: 40%;}

.cau_05 dl {position: absolute; left: 0; bottom: 50px;}
.cau_05 dl dt {font-size: 30px; font-weight: bold; margin-bottom: 25px;}
.cau_05 dl dd {font-size: 18px; color: #666;}

.cau_05 .menu_lay {padding: 270px 0 170px;}

.cau_05 .b_box ul li:nth-of-type(1) {text-align: right; position: relative;z-index: 2; margin-left: 33%;}
.cau_05 .b_box ul li:nth-of-type(2) {position: absolute; left: 0; bottom: 0; margin-left: 0; margin-right: 56%;}

@media screen and (max-width:1155px){
    .cau_05 dl dt {font-size: 20px;}
    .cau_05 dl dd {font-size: 12px; color: #666;}
}


@media screen and (max-width:768px){
    
    .cau_05 {background: url(/html/portfolio/cau/img/cau_05_bg_m.png); background-repeat: no-repeat; background-position: top; padding-top: 50px; background-size: contain;}

    .cau_05 .ulbox {position: relative;}
    .cau_05 li:nth-of-type(1) {padding-bottom: 0;}
    .cau_05 li:nth-of-type(2) {position: relative; right:auto; bottom: auto; padding: 0 20px; top: -20px; margin-bottom: -20px; margin-left: 0;}

    .cau_05 dl {position: static; text-align: center; margin: 50px 0;}
    .cau_05 dl dt {font-size: 24px; margin-bottom: 25px;}
    .cau_05 dl dd {font-size: 14px;  word-break: keep-all;}

    .cau_05 .menu_lay {padding: 0; margin-bottom: 50px;}

    .cau_05 .b_box ul li:nth-of-type(1) {text-align: right; position: relative;z-index: 2; padding-left: 20%; margin-left: 0;}
    .cau_05 .b_box ul li:nth-of-type(2) {position: relative; left: 0; bottom: 0; padding: 0; padding-right: 50%; box-sizing: border-box; top: -5em; margin-bottom: -5em; margin-right: 0;}
    
}