/*************************************************************************************
    Default Web : 758px ~ 
*************************************************************************************/
@media screen and (min-width: 758px) {

#mobile_header {
    display: none;
}
    

}

/*************************************************************************************
    Mobile Web :  ~ 767px
*************************************************************************************/
@media screen and (max-width: 767px) {

    .layer-popup-area {
        /*display: none !important;*/
    }
    .layer-popup-area .cont img {
   	    width: 100%;
    }
    /*
    layer popup
*/
    .layer-popup-area .cont {
	position: relative;
	width: 100%;
}
.layer-popup-area {
    position: absolute;
     top: 300px ! important;
    transform: translate(-50%, -50%) ! important;
    left: 50% ! important;
    margin-left: 0 ! important;
    width: 96% !important;
}
.layer-popup-area .txt-area {
    padding: 20px;
}
.layer-popup-area .txt-area h1 {
    letter-spacing: -0.45px;
    font-size: 20px;
}
.layer-popup-area .txt-area p {
    margin: 0 0 20px;
}
    .layer-popup-area.pop1 {
         top: 300px;
         left: 50%;
        transform:translate(-50%,-50%);
        margin-left: 0;
    }
    .layer-popup-area.pop1 .cont img {
        width: 100%;
    }
    .layer-popup-area.pop2 {
        top: 30px;
        left:  -46%;
        margin-left: 0;
    }
    
    .layer-popup-area.pop2.img-popup {
        top: 30px;
        left:  -46%;
        margin-left: 0;
    }
    .layer-popup-area.pop3 {
        top: 300px;
        transform:translate(-50%,-50%);
        left: 50%;
        width: 96%;
        margin-left: 0;
    }
    .layer-popup-area.pop4 {
        top: 250px;
        transform:translate(-50%,-50%);
        left: 50%;
        width: 96%;
        margin-left: 0;
    }
    .layer-popup-area .cont {
        position: relative;
        width: 100% !important;
    }
    .layer-popup-area .thm {
        display: block;
        width: 100%;
        max-width: 100%;
    }
    .layer-popup-area .thm img,
    .layer-popup-area img {
        display: block;
        max-width: 100%;
    }
    .layer-popup-area .txt-area ul.list {
        margin: 0 0 20px 20px
    }

    /* close */
    .layer-popup-area .close {
        width: 100% !important;
    }
    .layer-popup-area.pop3 .close {
        width: auto;
        left: auto;
        right: 10px;
        bottom: -3px;
    }
    .layer-popup-area.pop4 .close {
        width: auto;
        left: auto;
        right: 10px;
        bottom: -3px;
    }
    .layer-popup-area .btn-area a {
        margin: 5px;
    }
    
    /***************************
    Main layout 
***************************/
    #container {
        margin-top: 70px;
        width: 100%;
        padding: 0 0 10px;
    }
#container .innerWrap {
	position: relative;
	width: 100%;
	padding: 0;
}

/*main spot*/
.main-spot-list ul.slide-banner > li .inner {
    width: 100%;
}
.main-spot-list .controls-arrow {
	display: none;
}

/* banner 02 */
.main-spot-list ul.slide-banner > li.banner02 {
    background: #dadada url(/Images/main/main_banner02.png) 45% top no-repeat;
    background-size: cover;
}
.main-spot-list ul.slide-banner > li.banner02 .title-area {
    float: none;
    padding: 70px 0 0 30px;
}
.main-spot-list ul.slide-banner > li.banner02 .title-area .title {
    margin: 0 0 40px;
    font-size: 22px;
}
.main-spot-list ul.slide-banner > li.banner02 .title-area strong {
    display: block;
    margin: 15px 0 0;
    font-size: 32px;
}
.main-spot-list ul.slide-banner > li.banner02 .btn-more {
    margin: 0 0 10px;
}

/* banner 01 */
.main-spot-list ul.slide-banner > li.banner01 {
    background: #dedede url(/Images/main/main_spot1.png) 50% top no-repeat;
}
.main-spot-list ul.slide-banner > li.banner01 .title-area {
    float: none;
    padding: 70px 0 0 30px;
}
.main-spot-list ul.slide-banner > li.banner01 .title-area .title {
    margin: 0 0 40px;
    font-size: 22px;
}
.main-spot-list ul.slide-banner > li.banner01 .title-area strong {
     display: block;
    margin: 15px 0 0;
    font-size: 32px;
}

.main-spot-list ul.slide-banner > li.banner01 .spot-contents {
    display: none;
}

/* banner-img */
.main-spot-list ul.slide-banner > li.banner-img {
    background: #dedede url(/Images/main/main_banner_mobile_20210702.png) center top no-repeat;
    background-size: cover;
}
.main-spot-list ul.slide-banner > li.banner-img .inner > a {
    display: block;
    width: 100%;
    height: 340px;
}

/* banner-img.banner-20210820 */
.main-spot-list ul.slide-banner > li.banner-img.banner-20210820 {
    background: #1ea2a2 url(/Images/main/main_banner_mobile_20210820.jpg) center top no-repeat;
    background-size: cover;
}
.main-spot-list ul.slide-banner > li.banner-img.banner-20210820 .inner > a {
    display: block;
    width: 100%;
    height: 340px;
}

/* banner-img.banner-20210903 */
.main-spot-list ul.slide-banner > li.banner-img.banner-20210903 {
    background: #fff url(/Images/main/main_banner_mobile_20210903_v2.jpg) center top no-repeat;
    background-size: cover;
}
.main-spot-list ul.slide-banner > li.banner-img.banner-20210903 .inner > a {
    display: block;
    width: 100%;
    height: 340px;
}

/* banner-img.banner-20211029 */
.main-spot-list ul.slide-banner > li.banner-img.banner-20211029 {
    background: #fff url(/Images/main/main_banner_mobile_20211029.jpg) center top no-repeat;
    background-size: cover;
}
.main-spot-list ul.slide-banner > li.banner-img.banner-20211029 .inner > a {
    display: block;
    width: 100%;
    height: 340px;
}

#container .innerWrap {
    position: relative;
    width: 1024px;
    padding: 0;
}

/* cert-step */
.cert-step .step1 .title {
	padding: 20px 0 5px 80px;
	font-size: 15px;
	font-weight: 400;
	line-height: 30px;
	color: #fff;
	background: url(/Images/icon/icon_main_btn_list2.png) 16px 16px no-repeat;
    background-size: 50px;
}
.cert-step .step1 {
    position: relative;
    height: 100px;
}
.cert-step .step1 .title h3 {
    font-size: 18px;
    line-height: 1.2;
}
.cert-step .step1 ul {
    position: absolute;
    top: 15px;
    left: 170px;
	margin-left: 20px;
}
.cert-step .step1 ul li a {
	font-size: 15px;
	color: #cbe1fa;
}


.cert-step .step2 .title {
	padding: 20px 0 5px 80px;
	font-size: 15px;
	font-weight: 400;
	line-height: 30px;
	color: #fff;
	background: url(/Images/icon/icon_main_btn_list2.png) 16px 16px no-repeat;
    background-size: 50px;
}
.cert-step .step2 {
    position: relative;
    height: 100px;
}
.cert-step .step2 .title h3 {
    font-size: 18px;
    line-height: 1.2;
}
.cert-step .step2 ul {
    position: absolute;
    top: 15px;
    left: 170px;
	margin-left: 20px;
}
.cert-step .step2 ul li a {
	font-size: 15px;
	color: #cbe1fa;
}


.cert-step .step3 .title {
	padding: 20px 0 5px 80px;
	font-size: 15px;
	font-weight: 400;
	line-height: 30px;
	color: #fff;
	background: url(/Images/icon/icon_main_btn_list2.png) 16px 16px no-repeat;
    background-size: 50px;
}
.cert-step .step3 {
    position: relative;
    height: 100px;
}
.cert-step .step3 .title h3 {
    font-size: 18px;
    line-height: 1.2;
}
.cert-step .step3 ul {
    position: absolute;
    top: 15px;
    left: 170px;
	margin-left: 20px;
}
.cert-step .step3 ul li a {
	font-size: 15px;
	color: #cbe1fa;
}

/*cert-step*/
.cert-step {
	float: none;
	width: 100%;
}
.contents-area {
	float: none;
	width: 100%;
	margin-left: 0;
}

/*quick-btn-area*/
.quick-btn-area {
	width: 100%;
	height: auto;
    margin: 0;
	padding: 20px 0;
    border: 0;
	/*box-shadow: 0 2px 2px rgba(0,0,0,0.10);*/
	background-color: #fff;
}
.quick-btn-area ul {
    *zoom:1;
}
.quick-btn-area ul:after {
    display: block;
    content: '';
    clear: both;
}
.quick-btn-area ul li {
	float: left;
}
.quick-btn-area ul li.quick01 {
	width: 50%;
}
.quick-btn-area ul li.quick02 {
	width: 50%;
}
.quick-btn-area ul li.quick03 {
	width: 50%;
}
.quick-btn-area ul li.quick04 {
	width: 50%;
}
.quick-btn-area ul li.quick05 {
	width: 50%;
}
.quick-btn-area ul li a {
	display: block;
    padding-left: 20px;
	height: 60px;
	line-height: 60px;
	font-size: 14px;
	font-weight: 500;
	color: #806f61;
	text-align: left;
	background: none;
}

/*board-area*/

.board-area {
	width: 100%;
	height: 340px;
    margin: 0;
    border-top: 1px solid #dfdfdf;
	background-color: #fff;
    box-shadow: none;
}
.notice-area {
	float: none;
	width: 100%;
	padding: 30px 20px;
    border: none;
}
.notice-area ul li {
    *zoom:1;
}
.notice-area ul li:after {
    display: block;
    content: '';
    clear: both;
}
.notice-area ul li .title {
	float: none;
	width: 100%;
}
.notice-area ul li .date {
	display: none;
}

.etc-board-area {
	float: left;
	width: 100%;
	padding: 20px;
}

.event-area {

}
.event-area ul li {
    *zoom:1;
}
.event-area ul li:after {
    display: block;
    content: '';
    clear: both;
}
.event-area ul li .title {
	float: none;
	width: 100%;
}
.event-area ul li .date {
	display: none;
}

.faq-area {

}
.faq-area ul li {
    *zoom:1;
}
.faq-area ul li:after {
    display: block;
    content: '';
    clear: both;
}
.faq-area ul li .title {
	float: none;
	width: 100%;
}
.faq-area ul li .date {
	display: none;
}

/*인증훈련기관*/
.organ-area {
	margin: 0;
}
#container .innerWrap {
	position: relative;
	width: 100%;
	padding: 0;
}
.organ-area .innerWrap {
	width: 100%;
	height: auto;
	margin: 0 auto;
    box-shadow: none;
	background-color: #fff;
}
#container .organ-area .innerWrap {
    padding: 30px 0 30px;
}
.organ-area .innerWrap .title {
	float: none;
	width: 100%;
	padding: 0 0 0 20px;
}
.organ-area .innerWrap .organ-list {
	float: none;
	margin: 10px 0 0;
	padding: 0 20px 0 0;
}
.organ-area .innerWrap .organ-list li {
	float: none;
	width: 100%;
	height: 60px;
	margin: 0 0 10px 20px;
	padding: 0 0 0 80px;
}

/* banner-slide-area */
#container .banner-slide-area {
    margin: 20px 0;
}
#container .banner-slide-area .innerWrap {
	width: 100%;
    padding: 20px 40px;
    border: 0;
    background-color: #fff;
}
#container .banner-slide-area .innerWrap .controls-arrow2 a i {
    font-size: 24px;
}
#container .banner-slide-area .innerWrap .prev-arrow2 {
    left: 0;
}
#container .banner-slide-area .innerWrap .next-arrow2 {
    right: 0;
}


}