@charset "utf-8";
/* *******************************************************
 * filename : main.css
 * description : 메인  CSS
 * date : 2021-10-27
******************************************************** */
html * {
    /* outline: 1px solid seagreen; */
}
.container{position: relative;width: 1300px; margin: 0 auto;}
.cont_tit{font-size: 24px;}
.txts {font-size: 18px;color: #626262; line-height: 130%;}
.mob{display: none;}
@media (max-width: 1300px){
	.container{position: relative;width: 100%;}
}
@media (max-width: 1300px){
    .txts{font-size: 14px;}
}
@media (max-width: 768px){
    .txts{font-size: 14px;}
    .mob{display: block;}
    .visual{display: none;}

}
@media (max-width: 480px){
}
.skip{font-size: 0; position: absolute; top: 0; left: 0; width: 1px; height: 1px; overflow: hidden; line-height: 0; z-index: 1;}
.cb::after, .cb::before {content: "";clear: both;display: block;}

#main{background: url(/images/pattern.jpg); position: relative;height: 100vh;}
#main .mob{position: absolute; top: 0; left: 0;}
#main img{max-width: 100%;}
#main .logo img{width: 280px;}
#main .visual{ position: absolute;top:0; left: 0; width: 100%; height: 100%; background: url(/images/visual_v2.png) no-repeat; background-position: center bottom; background-size: cover;}
/* #main .visual::after{content: ''; display: block; position: absolute; left: 0; top: 0;width: 100%;height: 1026px; background: url(/images/visual_v2.png) no-repeat;background-position: center bottom; background-size: cover;} */
#main .content{position: relative; margin-left: 140px;padding-top: 180px; z-index: 1;height: 90%;}
#main .content .txts{margin-top: 50px;}
#main .content a{ position: relative;
    display: inline-block; background: linear-gradient(90deg, rgba(197,62,179,1), rgba(0,152,226,1), rgba(1,54,154,1), rgba(205,37,148,1)); padding: 10px 45px; 
    border-radius: 50px; margin: 50px auto 50px; animation: glowing 20s linear infinite; background-size: 400% 400%;}
#main .content .contact{margin-bottom: 64px;font-size: 23px;}
#main .contact h3{font-size: 20px; color: #434343;font-weight: 500;}
#main .contact h3 span{display: inline-block; width: 6px; height: 17px; background: #4f81bc;}
#main .contact p{color: #626262;font-size: 18px;}

#main footer{background: #fff;position: fixed; bottom: 0; left: 0; width: 100%;}
#main footer .row{display: flex;margin-left: 140px; align-items: center;flex-wrap: wrap;position: relative;}
#main .partners ul{display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
#main .partners ul li + li{margin-left: 10px;}
#main .partners ul li:last-child{margin-right: 40px;}
#main address{font-style: normal;display: block;}
#main address p{color: #626262; font-size: 12px;}

@keyframes glowing {
    0% { background-position: 0 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0 50%;}
}


@media all and (max-width: 1300px){
    #main .content{padding-top: 180px;}
    #main .content .txts{margin-top: 30px;}
    #main .content a{margin: 35px auto 35px;}
    #main footer{position: relative !important;}
    #main footer .row{justify-content: center; margin-left: 0;}
}

@media all and (max-width: 768px){
    #main .content{padding-top: 260px;}
    #main .partners ul{padding: 0 20px;}
    #main .partners ul li{width: 30%;}
    #main .partners ul li + li{margin-left: 5px;}
    #main .content{margin: 0 auto 50px; text-align: center;}
    #main .logo{padding: 0 20px;}
    #main .content .txts{padding: 0 50px;}
    #main address{text-align: center;padding: 7px 0;}
    #main address p{padding: 0 20px;line-height: 1.4;}
}
@media all and (max-width: 480px){
    #main{height: auto;}
	#main .logo{padding: 0 40px;}
    #main .content{padding-top: 200px;}
    #main .content .contact{font-size: 18px;}
    
}