/*───────────────────────────────────────────────────────────

    Common

───────────────────────────────────────────────────────────*/
/*:root {--main-color:#00ace7;--main-color2:#0081CC; } */
:root {--main-color:#00afec;--main-color2:#0081CC; }
.inner{width:100%;max-width:1080px;padding:0 15px;margin:0 auto;}
#wrap {position:relative; overflow:clip; } 

i::before{
    font-family: xeicon !important;
}

/* Header */
header {position:fixed;top:0;left:0;width:100%;z-index: 2500;background-color: #fff;}
header .inner{max-width:1760px;padding:25px 0px;}
header .logo{display:block;width:80px;height:auto; line-height:1;}

/* Top Btn */
.top-btn{display:none; position:fixed;bottom:50px;right:20px;align-items:center;justify-content:center;font-size: 30px;font-weight: 700;color:#fff;width:100px;height:100px;border-radius: 50%;background-color: #3b4147;box-shadow:2px 3px 3px rgba(0,0,0,.2);border:none;}
.top-btn.show {display:flex;}

/* Footer */
.footer{padding:40px 0 80px;background-color: #005BAC;color:#fff;}
.footer .inner{max-width:1760px;gap:0px; padding:0;}
.footer .logo{margin-top: 40px;font-size: 24px;font-weight: 700;}
.footer .sns-wrap{display: flex;gap:20px;}
.footer .sns-wrap a{transition:opacity .3s;}
.footer .sns-wrap .icon{display:block;width:24px;height:24px;}
.footer .sns-wrap .icon.facebook{background-image:url("../img/footer_facebook.svg");}
.footer .icon.insta{background-image:url("../img/footer_insta.svg");}
.footer .icon.earth {background-image:url("../img/footer_earth.svg");}
.footer .info-wrap .title{display:block;font-size: 24px;font-weight: 600;margin-bottom:10px;}
.footer .info-wrap .desc{font-size:18px;font-weight: 400;}
.footer .contact-wrap{margin-top: 40px;}
.footer .contact-wrap li{display: flex;gap:10px;}
.footer .contact-wrap li + li{margin-top:3px;}
.footer .contact-wrap a{color:#fff;}
.footer .copyright{margin-top: 40px;color:#d2d2d2;}
.footer .contact-wrap i {
    margin-right: 6px;
    font-size: 19px;
    vertical-align: middle;
 }

.mgt_top {margin-top:95px;}


.cls_certimg {height:115px;}
.box_cert{ display: none !important; }


#contents {margin-bottom:120px;}

@media (min-width:1025px){ 
    /* Footer */
    .footer .sns-wrap a:hover{opacity: .6;}
    .footer .contact-wrap a:hover{text-decoration: underline;}
    header .inner{padding:25px 15px;} 
    .footer .inner {padding:0px 15px;}

	/*search btn*/
	#area_month {width:55%;}
	#area_searchbtn {width:14%;}

	.box_cert{ display: none !important; }
	.cls_certimg {height:230px;}
}

@media (max-width:1024px){
    .mgt_top{margin-top:65px;}

    /* Header */
    header .logo{width:60px;}
    header .inner{padding:10px 15px;}
    
    /* Top Btn */
    .top-btn{width:64px;height:64px;font-size:18px;}

    /* Footer */
    .footer .inner{flex-direction: column; padding:0px 15px;}
    .footer .contact-wrap li + li{margin-top: 0;}

    #contents {margin-bottom:60px;}

	/*search btn*/
	#area_month {width:45%;}
	#area_searchbtn {width:24%;}

	.box_cert{display: block !important; padding-top:20px;}
	#box_cert{display: none !important;}
}

@media (max-width:640px){
    .mgt_top{margin-top:50px;}

    /* Header */
    header .logo{width:50px;}
    header .inner { padding: 10px 15px; }
    /* Footer */
    .footer .logo{font-size:18px;}
    .footer .contact-wrap,
    .footer .copyright{margin-top: 15px;}
    .footer .info-wrap .title{font-size:16px;}
    .footer .info-wrap .desc{font-size:14px;}
    .footer .contact-wrap{font-size:14px;}
    .footer .contact-wrap li{gap:8px;}
    .footer .contact-wrap li::before{top:10px;}
    .footer .copyright{font-size:12px;}

    .song-list .icon, .song-menu .icon{width:30px; height:30px;}
    #contents {margin-bottom:34px;}

	/*search btn*/
	#area_month {width:45%;}
	#area_searchbtn {width:24%;}

	.box_cert{display: block !important; padding-top:20px;}
	#box_cert{display: none !important;}
}

@media (max-width: 480px){
    /* Footer */
    .footer{padding:26px 0 34px;}

	/*search btn*/
	#area_month {width:45%;}
	#area_searchbtn {width:24%;}

	.box_cert{display: block !important; padding-top:20px;}
	#box_cert{display: none !important;}
}