@charset "utf-8";

.visual-usc1994 {background-image:url("../img/sub/visual_usc1994.jpg");}

.usc-wrap {padding:140px 0; *zoom:1;}
.usc-wrap:after {content:""; display:block; visibility:hidden; clear:both;}
.usc-wrap .usc-tit {float:left; width:40%;}
.usc-wrap .usc-tit em {display:block; color:#222; font-family:"NotoSansKR-DemiLight",sans-serif; font-size:1.750em; font-weight:400; letter-spacing:-0.01em; line-height:1;}
.usc-wrap .usc-tit h3 {display:block; margin:10px 0 0; color:#222; font-size:3.125em; font-weight:700; letter-spacing:-0.01em; line-height:1.360em;}
.usc-wrap .usc-cont {float:right; width:56.6%;}
.usc-wrap .usc-cont .main-paragraph {font-size:1.250em; letter-spacing:-0.01em; line-height:1.900em; word-break:keep-all;}
.usc-wrap .usc-cont .sub-paragraph {font-size:1.125em; letter-spacing:-0.05em; line-height:1.778em; word-break:keep-all;}

.usc-sec1 li {padding:30px 0; border-bottom:2px solid #ccc;}
.usc-sec1 li:first-child {padding:0 0 50px;}
.usc-sec1 li strong {display:block; margin:30px 0 15px; font-size:1.750em; font-weight:500; letter-spacing:-0.01em; line-height:1.143em;}

.usc-sec2 {background-color:#f8f8f8;}
.opti3m {display:inline-block; position:relative; margin:50px 0 0;}
.opti3m .system-arrow {position:absolute; left:8.2%; top:0; width:83.4%;}
.opti3m .system-arrow img {width:100%; vertical-align:top;}
.opti3m .system-arrow .arrow {position:absolute; left:0; top:0; width:100%; height:100%; opacity:0; background-repeat:no-repeat; background-position:center center; background-size:contain;
    -webkit-transition:1200ms ease-out;
    -moz-transition:1200ms ease-out;
    -o-transition:1200ms ease-out;
    transition:1200ms ease-out;
    -webkit-transform:rotateZ(-135deg);
    -moz-transform:rotateZ(-135deg);
    -ms-transform:rotateZ(-135deg);
    -o-transform:rotateZ(-135deg);
    transform:rotateZ(-135deg);
}
.opti3m .system-arrow .arrow01 {background-image:url("../img/sub/opti_arrow1.png");}
.opti3m .system-arrow .arrow02 {background-image:url("../img/sub/opti_arrow2.png");
    -webkit-transition-delay:800ms;
    -moz-transition-delay:800ms;
    -o-transition-delay:800ms;
    transition-delay:800ms;
}
.opti3m .system-arrow .arrow03 {background-image:url("../img/sub/opti_arrow3.png");
    -webkit-transition-delay:1600ms;
    -moz-transition-delay:1600ms;
    -o-transition-delay:1600ms;
    transition-delay:1600ms;
}
.opti3m .system-order {position:absolute; left:0; top:0; width:100%; height:100%; font-size:0; text-indent:-9999px; opacity:0; background-repeat:no-repeat; background-position:center top; background-size:cover;
    -webkit-transition:600ms linear;
    -moz-transition:600ms linear;
    -o-transition:600ms linear;
    transition:600ms linear;
}
.opti3m .system01 {background-image:url("../img/sub/opti_step1.png");
    -webkit-transition-delay:400ms;
    -moz-transition-delay:400ms;
    -o-transition-delay:400ms;
    transition-delay:400ms;
}
.opti3m .system02 {background-image:url("../img/sub/opti_step2.png");
    -webkit-transition-delay:1300ms;
    -moz-transition-delay:1300ms;
    -o-transition-delay:1300ms;
    transition-delay:1300ms;
}
.opti3m .system03 {background-image:url("../img/sub/opti_step3.png");
    -webkit-transition-delay:1900ms;
    -moz-transition-delay:1900ms;
    -o-transition-delay:1900ms;
    transition-delay:1900ms;
}
.opti3m.started .system-arrow .arrow {opacity:1;
    -webkit-transform:rotateZ(0);
    -moz-transform:rotateZ(0);
    -ms-transform:rotateZ(0);
    -o-transform:rotateZ(0);
    transform:rotateZ(0);
}
.opti3m.started .system-order {opacity:1;}
.system-list-wrap {margin:40px 0 0;}
.system-list {*zoom:1;}
.system-list:after {content:""; display:block; visibility:hidden; clear:both;}
.system-list .swiper-slide {width:auto;}
.system-list .system-box {margin-right:100px;}
.system-list b {display:block; font-size:1.250em; font-weight:700; letter-spacing:-0.05em; line-height:1;}
.system-list2 {padding:24px 0 0;}
.system-list2 > li {position:relative; padding-left:12px; font-size:1.125em; letter-spacing:-0.05em; line-height:1.778em;}
.system-list2 > li:before {content:"-"; position:absolute; left:0; top:0;}

.usc-sec3 ul {border-top:2px solid #ccc;}
.usc-sec3 ul li {padding:40px 0 35px; border-bottom:2px solid #ccc;}
.usc-sec3 ul .fact {color:#888; font-family:"Montserrat",sans-serif; font-size:0.875em; font-weight:600; letter-spacing:-0.01em; line-height:1;}
.usc-sec3 ul strong {display:block; margin:7px 0 10px; color:#222; font-size:1.750em; font-weight:500; letter-spacing:-0.01em; line-height:1.143em;}

.footer {margin-top:0 !important;}



@media screen and (max-width:1560px){
.usc-wrap .usc-tit h3 {font-size:2.6em;}
}
/* end media 1560px */


@media screen and (max-width:1023px){
.usc-wrap {padding:100px 0;}
.usc-wrap .usc-tit {float:none; width:100%; text-align:center;}
.usc-wrap .usc-cont {float:none; width:100%; margin:30px 0 0;}

.usc-sec1 li:first-child {text-align:center;}

.opti-wrap {text-align:center;}
.system-list b {font-size:1.333em; letter-spacing:-0.025em;}
.system-list2 > li {font-size:1.167em; line-height:1.714em;}
}
/* end media 1023px */


@media screen and (max-width:767px){
.visual-usc1994 {background-image:url("../img/sub/m_visual_usc1994.jpg");}

.usc-wrap {padding:60px 0;}
.usc-wrap .usc-tit em {font-size:1.500em;}
.usc-wrap .usc-tit h3 {margin:5px 0 0; font-size:2.083em;}
.usc-wrap .usc-cont {margin:20px 0 0;}
.usc-wrap .usc-cont .main-paragraph {font-size:1.167em; line-height:1.500em;}
.usc-wrap .usc-cont .sub-paragraph {font-size:1.167em; line-height:1.500em;}

.usc-sec1 li {padding:20px 0; border-width:1px;}
.usc-sec1 li:first-child {padding:0 0 35px;}
.usc-sec1 li strong {margin:25px 0 12px; font-size:1.667em;}

.system-list-wrap {margin:20px 0 0;}
.system-list .system-box {margin-right:50px;}
.system-list2 {padding:12px 0 0;}
.system-list2 > li {padding-left:8px;}

.usc-sec3 ul {border-width:1px;}
.usc-sec3 ul li {padding:25px 0 20px; border-width:1px;}
.usc-sec3 ul .fact {font-size:1em;}
.usc-sec3 ul strong {margin:9px 0 15px; font-size:1.667em;}
}
/* end media 767px */


@media screen and (max-width:500px){
.system-list .system-box {margin-right:20px;}
}
/* end media 500px */


@media screen and (max-width:359px){
.system-list2 > li {font-size:1em;}
}
/* end media 359px */