@charset "utf-8";

@font-face{
	font-family: 'SamsungOneKorea';
	src: url('./skin5/font/SamsungOneKorean-400-v1.2-20190628.eot');
	src: url('./skin5/font/SamsungOneKorean-400-v1.2-20190628.eot?#iefix') format("embedded-opentype"),
	url('./skin5/font/SamsungOneKorean-400-v1.2-20190628.woff2') format("woff2"),
	url('./skin5/font/SamsungOneKorean-400-v1.2-20190628.woff') format("woff"),
	url('./skin5/font/SamsungOneKorean-400-v1.2-20190628.svg') format("svg");
	font-weight: normal;
	font-style: normal;
}
@font-face{
	font-family: 'SamsungOneKorea';
	src: url('./skin5/font/SamsungOneKorean-700-v1.2-20190628.eot');
	src: url('./skin5/font/SamsungOneKorean-700-v1.2-20190628.eot?#iefix') format("embedded-opentype"),
	url('./skin5/font/SamsungOneKorean-700-v1.2-20190628.woff2') format("woff2"),
	url('./skin5/font/SamsungOneKorean-700-v1.2-20190628.woff') format("woff"),
	url('./skin5/font/SamsungOneKorean-700-v1.2-20190628.svg') format("svg");
	font-weight: bold;
	font-style: normal;
}

body{margin:0;padding:0;font-family:SamsungOneKorea;font-weight:normal;font-size:12px;}
ul, li, h1{margin:0;padding:0;list-style:none;}

div#wrapper{width:100%;height:100%;background-color:#ffffff;}


.header{position:fixed;left:0;top:0;width:100%;height:80px;padding:0;line-height:80px;background-color:#f7f7f7;}
.header:after{display:block;content:'';clear:both;}
.top{width:calc(100% - 30px);height:calc(80px - 24px);margin:0 auto;padding:24px 15px 0 15px;}
h1.logo{float:left;width:120px;height:34px;}
h1.logo a{display:block;width:120px;height:34px;text-align:center;line-height:34px;}
h2.title{margin:40px 0 0 0;padding:0 0 0 44px;}
.nav{float:left;}
.tabs{width:auto;height:34px;padding-left:24px;}
.tabs > li{float:left;width:auto;font-size:14px;padding:0 12px;}
.tabs > li a{display:block;width:auto;height:34px;text-align:center;line-height:34px;text-decoration:none;color:#000;font-weight:bold;}

.section{position:absolute;left:0;top:80px;display:table;width:calc(100% - 40px);height:calc(100% - 185px);padding:20px 15px 20px 15px;overflow:auto;}
.booksect{display:table-cell;vertical-align:middle;width:100%;height:100%;margin:auto;}
.booksect h2{width:100%;margin:0 auto;}
.booklist{width:100%;margin:20px auto;}
.item6 > ul > li{float:left;width:calc(100% / 6);}
.item1 > ul > li{width:173px;margin:20px auto 0 auto;}
.item1 > ul > li img{width:100%;}
.booklist > li{text-align:center;font-size:15px;}
.booklist > li img{width:80%;border:1px solid #e0e0e0;box-shadow:2px 2px 4px #dbdbdb;}
.booklist:after{display:block;content:'';clear:both;}

.footer{position:fixed;left:0;bottom:0;width:100%;background-color:#fff;border-top:1px solid #ddd;}
.footer > p{width:calc(100% - 30px);100%;height:auto;margin:0 auto;padding:20px 15px 20px 15px;color:#363636;}

.mmpopbtn5mD657b{display:none;}
.mmpopbtn5mD657b > a{display:block;width:80px;height:80px;text-align:center;}
.mmpopbtn5mD657b > a > img{vertical-align:middle;}
.sidenav {height: 100%;width: 0;position: fixed;z-index: 999;top: 0;right: 0;background-color: #fff;overflow-x: hidden;transition: 0.5s;padding-top: 40px;font-size:15px;}
.sidenav a {padding: 5px 5px 5px 40px;text-decoration: none;color: #000;display: block;transition: 0.3s;}
.sidenav .closebtn {position: absolute;top: 0;right: 25px;margin-left: 50px;padding:8px 0 0 40px;}
.bbg{z-index:998;width:100%;height:100%;position:fixed;top:0;left:0;background-color:rgba(0,0,0,0.7);transition: 0.5s;overflow:hidden;display:none;}
.tabsm > li{line-height:30px;}
.tabsm > li:first-child{margin-top:40px;}

@media(min-width:2400px){
.booksect h2{max-width:1950px;}
.booklist{max-width:1950px;}
}

@media(max-width:1960px){
.booksect h2{max-width:1300px;}
.booklist{max-width:1300px;}
}

@media(max-width:1600px){ 
.header{position:static;}
.section{position:static;}
.footer{position:static;}
}

@media(max-width:1402px){
h2.title{padding:0 0 0 20px;}
}

@media(max-width:900px){
.item6 > ul > li{float:left;width:calc(100% / 3);}
}

@media(max-width:414px){
.item6 > ul > li{float:left;width:calc(100% / 1);}
.booklist > li{width:calc(100% / 1);}
.mmpopbtn5mD657b{display:inline;position:absolute;top:0px;right:0px;z-index:999;}
.nav{display:none;}
}




/* 마우스오버 효과 */
.tabs li a,.tabs li a:visited,.tabs li a:hover,.tabs li a:active{
  -webkit-backface-visibility:hidden;
          backface-visibility:hidden;
	position:relative;
  transition:0.5s color ease;
	color:#000;
}
.tabs li a:hover{color:#000;}
.tabs li a.before:before, .tabs li a.after:after{
  content: "";
  transition:0.5s all ease;
  -webkit-backface-visibility:hidden;
          backface-visibility:hidden;
  position:absolute;
}
.tabs li a.after:after{bottom:0;}
.tabs li a.before:before, .tabs li a.after:after{height:1px;width:0;background:#000;}
.tabs li a.mbtn:after{
  left:0%;
  -webkit-transform:translateX(0%);
          transform:translateX(0%);
}
.tabs li a.before:hover:before, .tabs li a.after:hover:after{width:100%;}
.tabs li.active > a.after:after{width:100%;}