@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Nanum+Gothic:wght@400;700;800&display=swap');

/* ***** reset ***** */

*{-webkit-text-size-adjust:none;-webkit-tap-highlight-color:rgba(255,255,255,0);}
body{-webkit-font-smoothing:antialiased;font-family:'Nanum Gothic', sans-serif;font-size:17px;font-weight:400;color:#3a3a3a;}
html,body,p,h1,h2,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,table,th,td,form,fieldset,legend,input,textarea,button,select,pre,a{margin:0;padding:0;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}
ul,ol,li{display:block;list-style:none;}
img{border:0px none;max-width:100%;}
img,input,button,label,select{vertical-align:middle;}
input[type='submit'],input[type='button'],button{cursor:pointer;overflow:visible;}
i,em,address{font-style:normal;}
a{text-decoration:none;color:#333;outline:0;}
a:hover{text-decoration:none;}
table{border-spacing:0;table-layout:fixed;width:100%;}
table table{width:auto;}
caption{overflow:hidden;width:1px;height:1px;padding:0;margin-top:-1px;font-size:0;line-height:0;text-indent:-9999px;}
input[type='text'],input[type='password'],input[type='number'],input[type="submit"], button, select, textarea{-webkit-appearance:none;appearance:none;font-size:17px;background:transparent;border:none;border-radius:0;box-sizing:border-box;}

/* ***** layout ***** */
#wrap{min-width:320px;max-width:768px;width:100%;margin:0 auto;}
/*#header{position:fixed;top:0;padding:0 20px;display:flex;align-items:center;max-width:768px;width:100%;height:80px;background:#fff;box-sizing:border-box;z-index:100;} */
#header{position:fixed;top:0;padding:0 20px;display:flex;align-items:center;max-width:768px;width:100%;height:86px;background:url('../../ansanbo6_common/images/bg_gnb.png') repeat-x left bottom;box-sizing:border-box;z-index:100;}
#btnMenu{display:block;position:absolute;right:10px;top:50%;margin-top:-15px;width:30px;height:30px;text-indent:-9999px;background:url('../../ansanbo6_common/images/ico_menu.png') no-repeat center;}
#btnMenu.active{background-image:url('../../ansanbo6_common/images/ico_close.png');}
#pagination{display:none;position:fixed;top:78px;bottom:0;margin:0 auto;padding:15px;max-width:768px;width:100%;background:#fff;border-top:1px solid #ededed;box-sizing:border-box;overflow-y:auto;z-index:100;}
#pagination .swiper-pagination{position:static;display:flex;align-items:center;flex-wrap:wrap;box-sizing:border-box;}
#pagination .swiper-pagination > div{padding:15px;width:calc(100% / 3);height:auto;background:#fff;opacity:1;box-sizing:border-box;}
#pagination .swiper-pagination > div a{display:block;position:relative;text-align:center;}
#pagination .swiper-pagination > div .thum{display:block;}
#pagination .swiper-pagination > div .num{position:absolute;top:50%;left:50%;margin-left:-31px;margin-top:-31px;width:62px;height:62px;line-height:62px;font-size:24px;font-weight:bold;color:#fff;text-align:center;background:rgba(0,0,0,0.4);border-radius:50%;}
#pagination .swiper-pagination > div.swiper-pagination-bullet-active .num{color:yellow;background:#000;}
#pagination #btnMenuClose{display:block;width:24px;height:24px;text-indent:-9999px;}
#pagination.active{display:block;}
#container{padding-top:78px;}
#conSlider .swiper-scrollbar{bottom:inherit;top:3px;background:rgba(0,0,0,0.1);}
#conSlider .swiper-scrollbar .swiper-scrollbar-drag{background:rgba(255,255,255,0.5);}
#conSlider .swiperGrp{position:fixed;top:50%;margin-top:-56px;max-width:768px;width:100%;z-index:100;}
#conSlider .swiperGrp > button{width:56px;height:112px;text-indent:-9999px;}
#conSlider .swiperGrp .swiper-button-prev{left:0;background:url('../../ansanbo6_common/images/ico_prev.png') no-repeat center;}
#conSlider .swiperGrp .swiper-button-next{right:0;background:url('../../ansanbo6_common/images/ico_next.png') no-repeat center;}
#conSlider .swiper-button-next.swiper-button-disabled,
#conSlider .swiper-button-prev.swiper-button-disabled{opacity:0.2;}
#footer{padding:35px 20px;text-align:center;background:#595757;box-sizing:border-box;}

@media screen and (max-width:700px) {
	body{background:#595757;}
	#header img{max-width:85%;}
}

@media screen and (max-width:500px) {
	#header{padding:0 15px;height:60px;}
	#container{padding-top:60px;}
	#pagination{top:60px;padding:5px;}
	#pagination .swiper-pagination > div{padding:5px;}
	#pagination .swiper-pagination > div .num{margin-left:-20px;margin-top:-20px;width:40px;height:40px;line-height:40px;font-size:20px;}
	#conSlider .swiperGrp{margin-top:-35px;}
	#conSlider .swiperGrp > button{width:35px;height:70px;background-size:contain !important;}
	#footer{padding:20px 15px;}
}