/*Content CSS*/
#c2_wrap{position: relative; overflow: hidden; width: 100%;}
#c2_wrap > article{padding: 135px 0;}
#c2_wrap .c_inner{width: 100%; max-width: 1400px; padding: 0 50px; margin: 0 auto;}
#c2_wrap br.mob{display: none;}

/* font-style */
#c2_wrap .fs_60{font-size: 60px; font-weight: 700; line-height: 1.2;}
#c2_wrap .fs_30{font-size: 30px; line-height: 1.5;}
#c2_wrap .fs_27{font-size: 27px; line-height: 1.2;}
#c2_wrap .fs_24{font-size: 24px; line-height: 1.35;}
#c2_wrap .fs_19{font-size: 19px; line-height: 1.58;}
#c2_wrap .fs_17{font-size: 17px; line-height: 1.76;}
#c2_wrap .fs_16{font-size: 16px; line-height: 1.7;}

/* vm_btn */
#c2_wrap .vm_btn a{overflow: hidden; display: inline-flex; align-items: center; justify-content: space-between; padding: 0 12px 0 31px; width: 228px; height: 54px; border: solid 1px #fff; border-radius: 27px; position: relative; z-index: 2; transition: .3s;}
#c2_wrap .vm_btn a::before{content: ''; display: block; width: 38px; height: 38px; border-radius: 27px; background-color: #fff; position: absolute; top: 50%; transform: translateY(-50%); right: 12px; z-index: -1; transition: .6s;}
#c2_wrap .vm_btn a i{display: flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 50%; }
#c2_wrap .vm_btn a span{color: #fff; transition: .6s;}

/* dot_lsit */
#c2_wrap .dot_list li{position: relative; padding-left: 12px; color: rgba(255, 255, 255, .8);}
#c2_wrap .dot_list li::before{content: ''; display: block; width: 4px; height: 3px; background-color: #fff; position: absolute; top: 12px; left: 0;}

/* c2_wrap */
#c2_wrap .top{position: relative;}
#c2_wrap .top h3{margin-bottom: 15px; max-width: calc(100% - 300px); color: #fff;}
#c2_wrap .top h3::after{content: ''; display: block; width: 45px; height: 3px; background-color: #fff; margin: 33px 0 0;}
#c2_wrap .top h4{margin-bottom: 23px; font-weight: 700; color: #fff;}
#c2_wrap .top p{color: #fff; font-weight: 300;}

/* step_list */
#c2_wrap .step_list{display: flex; margin-top: 115px; border-top: solid 1px rgba(255,255,255,.5);}
#c2_wrap .step_list li {position: relative; width: 20%; padding-top: 57px; text-align: center; }
#c2_wrap .step_list li .dots{width: 11px; height: 11px; position: absolute; border-radius: 50%; background-color: #fff; left: 50%; transform: translateX(-50%); top: -6px; }

#c2_wrap .step_list li i{display: block; min-height: 50px; margin-bottom: 33px;}
#c2_wrap .step_list li .txt{padding: 0 10px;}
#c2_wrap .step_list li .txt span{display: block; margin-bottom: 14px; color: rgba(255,255,255,.36); font-weight: 500; }
#c2_wrap .step_list li .txt h5{color: #fff; font-weight: 700; text-shadow: 0 0 18px rgba(0, 0, 0, 0.59);}

#c2_wrap .step_list li.active .dots > span {border-radius: 100%; position: absolute; top: 50%; left:50%; opacity: 0; margin: 0; width: 74px; height: 74px; border:1px solid #fff; -webkit-animation: intro-circle 2s 0s linear infinite; animation: intro-circle 2s 0s linear infinite; margin-left: -37.5px; margin-top: -37.5px;}
#c2_wrap .step_list li.active .dots > span:nth-child(2) { -webkit-animation-delay: -1s; animation-delay: -1s; }
#c2_wrap .step_list li.active .dots > span:nth-child(3) {-webkit-animation-delay: -0.5s; animation-delay: -0.5s; }

@keyframes intro-circle {
    0% {-webkit-transform: scale(0.3); transform: scale(0.3); opacity: 0.3;}
    50% {opacity: 0.8;}
    100% {-webkit-transform: scale(1);transform: scale(1);opacity: 0;}
}
/* sec1 */
#c2_wrap .sec1{background: url('../img/c2_bg.jpg') 50% / cover no-repeat;}

@media screen and (min-width: 1901px) {
    #c2_wrap .step_list{padding: 0 60px;}
}

@media screen and (min-width: 1025px) {
    #c2_wrap .vm_btn a:hover::before{transform: scale(15);}
    #c2_wrap .vm_btn a:hover span{color: #000;}

    #c2_wrap .top .vm_btn{position: absolute; right: 0; top: 0;}
}

@media screen and (max-width: 1600px) {
    #c2_wrap > article{padding: 70px 0;}
}

@media screen and (max-width: 1400px) {
    #c2_wrap br:not(.space){display: none;}

    /* font-style */
    #c2_wrap .fs_60{font-size: 50px;}
    #c2_wrap .fs_30{font-size: 28px;}
    #c2_wrap .fs_27{font-size: 25px;}
    #c2_wrap .fs_24{font-size: 22px;}
    #c2_wrap .fs_19{font-size: 18px;}
    #c2_wrap .fs_17{font-size: 16px; line-height: 1.7;}
    #c2_wrap .fs_16{font-size: 15px;}

    /* vm_btn */
    #c2_wrap .vm_btn a{padding-left: 20px;}

    /* step_list */
    #c2_wrap .step_list{margin-top: 80px;}
    #c2_wrap .step_list li i{ margin-bottom: 15px;}
    #c2_wrap .step_list li .txt span{margin-bottom: 5px;}

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

}
@media screen and (max-width: 1024px) {
    #c2_wrap > article{padding: 50px 0;}
    #c2_wrap .c_inner{padding: 0 30px;}
    #c2_wrap br.mob{display: block;}

    /* font-style */
    #c2_wrap .fs_60{font-size: 45px;}
    #c2_wrap .fs_30{font-size: 26px;}
    #c2_wrap .fs_27{font-size: 23px;}
    #c2_wrap .fs_24{font-size: 20px;}
    #c2_wrap .fs_19{font-size: 17px;}
    #c2_wrap .fs_17{font-size: 15px;}
    #c2_wrap .fs_16{font-size: 14px;}

    /* dot_list */
    #c2_wrap .dot_list li::before{top: 11px;}

    /* c2_wrap */
    #c2_wrap .top{text-align: center;}
    #c2_wrap .top h3{margin-bottom: 15px; max-width: 100%;}
    #c2_wrap .top h3::after{width: 35px; margin: 25px auto 0;}
    #c2_wrap .top h4{margin-bottom: 15px;}

    /* vm_btn */
    #c2_wrap .vm_btn{text-align: center; margin-top: 30px;}
    #c2_wrap .vm_btn a{width: 220px; height: 48px;}
    #c2_wrap .vm_btn a::before{width: 30px; height: 30px;}
    #c2_wrap .vm_btn a i{width: 30px; height: 30px;}

}

@media screen and (max-width: 768px) {
    /* step_list */
    #c2_wrap .step_list{flex-wrap: wrap; margin-top: 50px; border-top: 0;}
    #c2_wrap .step_list li {width: 100%; padding: 35px 0; border-top: solid 1px rgba(255,255,255,.5);}
    #c2_wrap .step_list li:last-child{padding-bottom: 0;}
    #c2_wrap .step_list li i{min-height: 0;}
    #c2_wrap .step_list li i img{transform: scale(.8);}
    #c2_wrap .step_list li .dots{width: 10px; height: 10px; top: -5px;}
    #c2_wrap .step_list li.active .dots > span{width: 50px; height: 50px; margin-left: -25px; margin-top: -25px;}

}

@media screen and (max-width: 640px) {
    #c2_wrap .c_inner{padding: 0 20px;}
    /* font-style */
    #c2_wrap .fs_60{font-size: 40px;}
    #c2_wrap .fs_30{font-size: 24px;}
    #c2_wrap .fs_27{font-size: 21px;}
    #c2_wrap .fs_24{font-size: 19px;}
    #c2_wrap .fs_19{font-size: 16px;}
    #c2_wrap .fs_17{font-size: 14px;}
    #c2_wrap .fs_16{font-size: 13px;}

    /* vm_btn */
    #c2_wrap .vm_btn a{width: 100%; height: 45px; padding-right: 8px;}
    #c2_wrap .vm_btn a::before{right: 8px;}
}

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

}